{"id":9253,"date":"2025-09-24T13:37:17","date_gmt":"2025-09-24T16:37:17","guid":{"rendered":"https:\/\/erpm8.cloud\/?page_id=9253"},"modified":"2026-06-26T07:56:04","modified_gmt":"2026-06-26T10:56:04","slug":"portal-do-cliente","status":"publish","type":"page","link":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/","title":{"rendered":"portal-do-cliente"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"9253\" class=\"elementor elementor-9253\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"has_ae_slider elementor-section elementor-top-section elementor-element elementor-element-7211ff7 elementor-section-full_width elementor-section-height-default elementor-section-height-default ae-bg-gallery-type-default\" data-id=\"7211ff7\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"has_ae_slider elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-570cf0e ae-bg-gallery-type-default\" data-id=\"570cf0e\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-f4a9ae1 elementor-widget elementor-widget-html\" data-id=\"f4a9ae1\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<!DOCTYPE html>\r\n<html lang=\"pt-BR\">\r\n<head>\r\n  <meta charset=\"UTF-8\" \/>\r\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n  <title>Portal do Cliente | ERP M8<\/title>\r\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n  <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\">\r\n\r\n  <style>\r\n    \/* =========================================================\r\n       ISOLAMENTO DO TEMA WORDPRESS \/ ELEMENTOR\r\n       Tudo \u00e9 prefixado com .m8-lp-root para n\u00e3o vazar estilo\r\n       ========================================================= *\/\r\n    .m8-lp-root {\r\n      --orange: #ff8c00;\r\n      --orange-dark: #e67e00;\r\n      --orange-soft: #fff4e5;\r\n      --orange-line: #ffdfb3;\r\n      --dark: #171717;\r\n      --text: #52525b;\r\n      --muted: #737373;\r\n      --bg: #ffffff;\r\n      --bg-soft: #f9fafb;\r\n      --line: #e5e7eb;\r\n      --shadow: 0 8px 30px rgba(0,0,0,.06);\r\n      --shadow-lg: 0 20px 60px rgba(0,0,0,.10);\r\n\r\n      font-family: 'Poppins', sans-serif !important;\r\n      color: var(--text) !important;\r\n      line-height: 1.65 !important;\r\n      background: #fff !important;\r\n      text-align: left !important;\r\n      font-size: 16px !important;\r\n      overflow-x: hidden;\r\n    }\r\n\r\n    .m8-lp-root *, .m8-lp-root *::before, .m8-lp-root *::after {\r\n      box-sizing: border-box !important;\r\n      margin: 0 !important;\r\n      padding: 0 !important;\r\n    }\r\n\r\n    .m8-lp-root h1, .m8-lp-root h2, .m8-lp-root h3, .m8-lp-root h4, .m8-lp-root p, .m8-lp-root span, .m8-lp-root a, .m8-lp-root button, .m8-lp-root input, .m8-lp-root select, .m8-lp-root textarea {\r\n      font-family: 'Poppins', sans-serif !important;\r\n    }\r\n\r\n    .m8-lp-root h1, .m8-lp-root h2, .m8-lp-root h3, .m8-lp-root h4 {\r\n      color: var(--dark) !important;\r\n      letter-spacing: -0.03em !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.2 !important;\r\n    }\r\n\r\n    .m8-lp-root a { text-decoration: none !important; color: inherit !important; }\r\n    .m8-lp-root img { display: block !important; max-width: 100% !important; border: none !important; box-shadow: none !important; border-radius: 0 !important; }\r\n    .m8-lp-root ul, .m8-lp-root li { list-style: none !important; }\r\n    .m8-lp-root table { border-collapse: collapse !important; border-spacing: 0 !important; }\r\n\r\n    \/* LAYOUT BASE *\/\r\n    .m8-lp-root .container { max-width: 1180px !important; margin: 0 auto !important; padding: 0 24px !important; width: 100% !important; }\r\n\r\n    \/* COMPONENTES *\/\r\n    .m8-lp-root .tag { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: var(--orange-soft) !important; color: var(--orange-dark) !important; border: 1px solid var(--orange-line) !important; padding: 7px 14px !important; border-radius: 999px !important; font-size: 12px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; }\r\n\r\n    .m8-lp-root .btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; padding: 15px 28px !important; border-radius: 999px !important; font-weight: 600 !important; font-size: 15px !important; transition: 0.25s ease !important; border: none !important; cursor: pointer !important; }\r\n    .m8-lp-root .btn-primary { background: linear-gradient(135deg, var(--orange), var(--orange-dark)) !important; color: #fff !important; box-shadow: 0 8px 24px rgba(255,140,0,.25) !important; }\r\n    .m8-lp-root .btn-primary:hover { transform: translateY(-2px) !important; box-shadow: 0 12px 30px rgba(255,140,0,.35) !important; }\r\n    .m8-lp-root .btn-outline { background: transparent !important; border: 1.5px solid rgba(255,255,255,.35) !important; color: #fff !important; }\r\n    .m8-lp-root .btn-outline:hover { background: rgba(255,255,255,.08) !important; }\r\n    .m8-lp-root .btn-white { background: #fff !important; color: var(--orange-dark) !important; }\r\n\r\n    \/* NAVBAR *\/\r\n    .m8-lp-root .navbar { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; z-index: 999 !important; background: rgba(255,255,255,.94) !important; backdrop-filter: blur(14px) !important; border-bottom: 1px solid var(--line) !important; }\r\n    .m8-lp-root .nav-inner { height: 76px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; }\r\n    .m8-lp-root .nav-logo img { height: 42px !important; width: auto !important; }\r\n    .m8-lp-root .nav-links { display: flex !important; align-items: center !important; gap: 28px !important; }\r\n    .m8-lp-root .nav-links a { font-size: 14px !important; font-weight: 500 !important; color: #5f6470 !important; transition: color .2s !important; }\r\n    .m8-lp-root .nav-links a:hover { color: var(--orange-dark) !important; }\r\n    .m8-lp-root .nav-cta { display: flex !important; align-items: center !important; gap: 12px !important; }\r\n    .m8-lp-root .nav-login-btn, .m8-lp-root .nav-demo-btn { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 10px 18px !important; border-radius: 999px !important; font-size: 14px !important; font-weight: 600 !important; transition: .25s ease !important; cursor: pointer !important; }\r\n    .m8-lp-root .nav-login-btn { border: 1.5px solid var(--line) !important; background: #fff !important; color: #454545 !important; }\r\n    .m8-lp-root .nav-login-btn:hover { border-color: var(--orange-line) !important; background: var(--orange-soft) !important; color: var(--orange-dark) !important; }\r\n    .m8-lp-root .nav-demo-btn { border: 1.5px solid var(--orange-line) !important; background: var(--orange-soft) !important; color: var(--orange-dark) !important; }\r\n    .m8-lp-root .nav-demo-btn:hover { transform: translateY(-1px) !important; }\r\n\r\n    \/* HERO *\/\r\n    .m8-lp-root .hero { position: relative !important; padding: 128px 0 70px !important; background: #0f1013 !important; }\r\n    .m8-lp-root .hero-overlay { position: absolute !important; inset: 0 !important; background: linear-gradient(180deg, rgba(18,18,24,.96) 0%, rgba(24,18,12,.94) 100%) !important; }\r\n    .m8-lp-root #heroCanvas { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; }\r\n    .m8-lp-root .hero-inner { position: relative !important; z-index: 2 !important; text-align: center !important; }\r\n    .m8-lp-root .hero .tag { margin-bottom: 18px !important; }\r\n    .m8-lp-root .hero h1 { font-size: clamp(32px, 4vw, 46px) !important; max-width: 800px !important; margin: 0 auto 18px !important; color: #fff !important; }\r\n    .m8-lp-root .hero h1 .hl { color: #ff9b39 !important; }\r\n    .m8-lp-root .hero p.hero-desc { max-width: 680px !important; margin: 0 auto 30px !important; color: rgba(255,255,255,.72) !important; font-size: 17px !important; line-height: 1.75 !important; }\r\n    .m8-lp-root .hero-actions { display: flex !important; justify-content: center !important; gap: 14px !important; flex-wrap: wrap !important; margin-bottom: 30px !important; }\r\n    .m8-lp-root .hero-badges { display: flex !important; justify-content: center !important; gap: 18px !important; flex-wrap: wrap !important; margin-bottom: 46px !important; }\r\n    .m8-lp-root .hero-badge { display: inline-flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; font-weight: 500 !important; color: rgba(255,255,255,.68) !important; }\r\n    .m8-lp-root .hero-badge i { color: #ff9b39 !important; }\r\n\r\n    \/* =========================================\r\n       NOVO MOCKUP DO PORTAL (FIEL AOS PRINTS)\r\n       ========================================= *\/\r\n    .m8-lp-root .portal-mock-wrap { max-width: 1060px !important; margin: 0 auto !important; position: relative !important; }\r\n    .m8-lp-root .portal-mock-glow { position: absolute !important; inset: -30px -20px auto -20px !important; height: 220px !important; background: radial-gradient(circle at center, rgba(255,140,0,.25), transparent 68%) !important; pointer-events: none !important; }\r\n    .m8-lp-root .portal-mock { position: relative !important; background: #f0f2f5 !important; border-radius: 20px !important; padding: 0 !important; overflow: hidden !important; box-shadow: 0 40px 100px rgba(0,0,0,.4) !important; border: 1px solid rgba(255,255,255,.08) !important; display: grid !important; grid-template-columns: 160px 1fr !important; min-height: 540px !important; text-align: left !important; }\r\n\r\n    \/* Sidebar *\/\r\n    .m8-lp-root .portal-side { background: #f8f9fa !important; border-right: 1px solid #e5e7eb !important; padding: 24px 0 20px !important; display: flex !important; flex-direction: column !important; }\r\n    .m8-lp-root .side-logo { padding: 0 20px !important; margin-bottom: 24px !important; }\r\n    .m8-lp-root .side-logo img { width: 90px !important; margin: 0 auto !important; }\r\n    .m8-lp-root .side-nav { display: flex !important; flex-direction: column !important; gap: 2px !important; }\r\n    .m8-lp-root .side-item { display: flex !important; align-items: center !important; gap: 12px !important; padding: 12px 20px !important; font-size: 12px !important; font-weight: 500 !important; color: #6b7280 !important; cursor: pointer !important; transition: .2s ease !important; position: relative !important; }\r\n    .m8-lp-root .side-item:hover, .m8-lp-root .side-item.active { background: #fff !important; color: #111827 !important; }\r\n    .m8-lp-root .side-item.active::before { content: '' !important; position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important; width: 3px !important; background: var(--orange) !important; }\r\n    .m8-lp-root .side-ico { width: 24px !important; height: 24px !important; border-radius: 50% !important; background: #f3f4f6 !important; color: #9ca3af !important; font-size: 11px !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; transition: .2s !important; }\r\n    .m8-lp-root .side-item:hover .side-ico, .m8-lp-root .side-item.active .side-ico { background: var(--orange) !important; color: #fff !important; }\r\n    .m8-lp-root .side-footer { margin-top: auto !important; padding: 24px 20px 0 !important; }\r\n    .m8-lp-root .side-user { display: flex !important; align-items: center !important; gap: 10px !important; font-size: 11px !important; color: #6b7280 !important; margin-bottom: 16px !important; }\r\n    .m8-lp-root .side-user .avatar { width: 28px !important; height: 28px !important; border-radius: 50% !important; background: #d1d5db !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 12px !important; color: #fff !important; }\r\n    .m8-lp-root .side-btn { display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; border: 1px solid #e5e7eb !important; background: #fff !important; color: #374151 !important; font-size: 11px !important; font-weight: 500 !important; border-radius: 8px !important; padding: 10px !important; width: 100% !important; }\r\n    .m8-lp-root .side-copy { font-size: 9px !important; color: #9ca3af !important; margin-top: 16px !important; line-height: 1.4 !important; }\r\n\r\n    \/* Main Area *\/\r\n    .m8-lp-root .portal-main { padding: 24px !important; }\r\n    .m8-lp-root .portal-shell { background: #fff !important; border-radius: 16px !important; box-shadow: 0 4px 6px -1px rgba(0,0,0,.05) !important; min-height: 100% !important; padding: 24px !important; border: 1px solid #f3f4f6 !important; }\r\n    .m8-lp-root .portal-header { display: flex !important; justify-content: space-between !important; align-items: flex-start !important; margin-bottom: 24px !important; flex-wrap: wrap !important; gap: 16px !important; }\r\n    .m8-lp-root .portal-title h4 { font-size: 20px !important; color: #111827 !important; margin-bottom: 4px !important; }\r\n    .m8-lp-root .portal-title p { font-size: 12px !important; color: #6b7280 !important; margin: 0 !important; }\r\n    .m8-lp-root .portal-company { border: 1px solid #e5e7eb !important; padding: 8px 14px !important; border-radius: 8px !important; font-size: 11px !important; color: #4b5563 !important; background: #fff !important; }\r\n\r\n    .m8-lp-root .tab-strip { display: flex !important; gap: 4px !important; margin-bottom: 16px !important; border-bottom: 1px solid #e5e7eb !important; padding-bottom: 8px !important; overflow-x: auto !important; white-space: nowrap !important; }\r\n    .m8-lp-root .tab-chip { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: #f3f4f6 !important; border: 1px solid #e5e7eb !important; border-radius: 4px !important; font-size: 11px !important; color: #4b5563 !important; padding: 6px 12px !important; }\r\n    .m8-lp-root .tab-chip.active { background: #f3f4f6 !important; border-bottom: 2px solid var(--orange) !important; color: #111827 !important; font-weight: 500 !important; }\r\n    .m8-lp-root .tab-chip i { font-size: 10px !important; cursor: pointer !important; }\r\n\r\n    .m8-lp-root .mock-screen { display: none !important; animation: fadeIn .3s ease !important; }\r\n    .m8-lp-root .mock-screen.active { display: block !important; }\r\n    @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }\r\n\r\n    \/* Dashboard Icons *\/\r\n    .m8-lp-root .dash-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 20px !important; padding-top: 10px !important; }\r\n    .m8-lp-root .dash-card { border: 1px solid #f3f4f6 !important; border-radius: 12px !important; height: 110px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; box-shadow: 0 4px 12px rgba(0,0,0,.03) !important; cursor: pointer !important; transition: .2s !important; background: #fff !important; }\r\n    .m8-lp-root .dash-card:hover { box-shadow: 0 10px 20px rgba(0,0,0,.06) !important; transform: translateY(-2px) !important; border-color: var(--orange-line) !important; }\r\n    .m8-lp-root .dash-card .dash-ico { width: 48px !important; height: 48px !important; border-radius: 50% !important; background: var(--orange) !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #fff !important; font-size: 22px !important; margin-bottom: 12px !important; }\r\n    .m8-lp-root .dash-card span { font-size: 11px !important; font-weight: 600 !important; color: #374151 !important; text-transform: uppercase !important; }\r\n\r\n    \/* Tables *\/\r\n    .m8-lp-root .table-top { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 16px !important; }\r\n    .m8-lp-root .table-search { display: flex !important; align-items: center !important; gap: 8px !important; }\r\n    .m8-lp-root .table-search input { height: 32px !important; border: 1px solid #d1d5db !important; border-radius: 6px !important; padding: 0 12px !important; font-size: 12px !important; width: 160px !important; outline: none !important; }\r\n    .m8-lp-root .table-search button { height: 32px !important; background: #111827 !important; border: none !important; border-radius: 6px !important; color: #fff !important; font-size: 12px !important; font-weight: 500 !important; padding: 0 14px !important; display: flex !important; align-items: center !important; gap: 6px !important; }\r\n    .m8-lp-root .table-meta { font-size: 11px !important; color: #6b7280 !important; text-align: right !important; margin-top: 4px !important; }\r\n\r\n    .m8-lp-root .table-responsive { width: 100% !important; overflow-x: auto !important; }\r\n    .m8-lp-root .portal-table { width: 100% !important; border-collapse: collapse !important; font-size: 11px !important; min-width: 600px !important; }\r\n    .m8-lp-root .portal-table th, .m8-lp-root .portal-table td { padding: 12px 10px !important; text-align: left !important; border-bottom: 1px solid #f3f4f6 !important; color: #4b5563 !important; }\r\n    .m8-lp-root .portal-table th { font-weight: 600 !important; color: #111827 !important; padding-bottom: 16px !important; }\r\n    .m8-lp-root .tcenter { text-align: center !important; }\r\n\r\n    \/* Status Pills *\/\r\n    .m8-lp-root .pill { display: inline-flex !important; align-items: center !important; justify-content: center !important; height: 22px !important; padding: 0 12px !important; border-radius: 999px !important; font-size: 10px !important; font-weight: 600 !important; width: 100% !important; max-width: 140px !important; }\r\n    .m8-lp-root .pill.green { background: #00d26a !important; color: #fff !important; }\r\n    .m8-lp-root .pill.yellow { background: #ffb800 !important; color: #fff !important; }\r\n\r\n    \/* Form OS *\/\r\n    .m8-lp-root .form-grid { display: grid !important; grid-template-columns: 140px 1fr !important; gap: 12px 20px !important; max-width: 600px !important; }\r\n    .m8-lp-root .form-grid label { font-size: 11px !important; font-weight: 500 !important; color: #374151 !important; padding-top: 10px !important; }\r\n    .m8-lp-root .input, .m8-lp-root .textarea, .m8-lp-root .select { width: 100% !important; border: 1px solid #d1d5db !important; border-radius: 6px !important; background: #fff !important; font-size: 11px !important; color: #4b5563 !important; padding: 8px 12px !important; height: 34px !important; outline: none !important; }\r\n    .m8-lp-root .textarea { height: 80px !important; resize: none !important; }\r\n    .m8-lp-root .submit-row { grid-column: 2 \/ 3 !important; margin-top: 10px !important; }\r\n    .m8-lp-root .mock-submit { display: inline-flex !important; background: #111827 !important; color: #fff !important; border: none !important; border-radius: 8px !important; padding: 12px 24px !important; font-size: 12px !important; font-weight: 500 !important; cursor: pointer !important; }\r\n\r\n    \/* STATS & SECTIONS *\/\r\n    .m8-lp-root .section { padding: 90px 0 !important; }\r\n    .m8-lp-root .sec-head { text-align: center !important; max-width: 760px !important; margin: 0 auto 58px !important; }\r\n    .m8-lp-root .sec-head h2 { font-size: clamp(28px, 3vw, 40px) !important; margin: 14px 0 !important; }\r\n    .m8-lp-root .sec-head p { font-size: 17px !important; color: #696969 !important; }\r\n\r\n    .m8-lp-root .stats { background: #171717 !important; padding: 42px 0 !important; }\r\n    .m8-lp-root .stats-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 10px !important; }\r\n    .m8-lp-root .stat { text-align: center !important; padding: 0 12px !important; }\r\n    .m8-lp-root .stat strong { display: block !important; color: #ff9b39 !important; font-size: 38px !important; font-weight: 700 !important; line-height: 1.05 !important; margin-bottom: 6px !important; }\r\n    .m8-lp-root .stat span { font-size: 13px !important; color: rgba(255,255,255,.58) !important; }\r\n\r\n    .m8-lp-root .problem-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 60px !important; align-items: start !important; }\r\n    .m8-lp-root .problem-list { display: flex !important; flex-direction: column !important; gap: 14px !important; margin: 28px 0 34px !important; }\r\n    .m8-lp-root .problem-item { display: flex !important; gap: 12px !important; align-items: flex-start !important; font-size: 15px !important; }\r\n    .m8-lp-root .problem-item i { margin-top: 4px !important; color: #ef4444 !important; }\r\n    .m8-lp-root .sol-cards { display: flex !important; flex-direction: column !important; gap: 14px !important; margin-top: 22px !important; }\r\n    .m8-lp-root .sol-card { display: flex !important; gap: 14px !important; background: #fff !important; border: 1px solid var(--line) !important; padding: 20px !important; border-radius: 16px !important; box-shadow: var(--shadow) !important; }\r\n    .m8-lp-root .sol-icon { width: 44px !important; height: 44px !important; border-radius: 12px !important; background: var(--orange-soft) !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; color: var(--orange-dark) !important; }\r\n    .m8-lp-root .sol-card h4 { font-size: 16px !important; margin-bottom: 4px !important; }\r\n    .m8-lp-root .sol-card p { font-size: 14px !important; color: #666 !important; }\r\n\r\n    \/* FEATURES *\/\r\n    .m8-lp-root .features { background: #f9fafb !important; }\r\n    .m8-lp-root .feature-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 20px !important; }\r\n    .m8-lp-root .feature-card { background: #fff !important; border: 1px solid var(--line) !important; border-radius: 16px !important; padding: 30px 20px !important; text-align: center !important; box-shadow: var(--shadow) !important; transition: .25s ease !important; }\r\n    .m8-lp-root .feature-card:hover { transform: translateY(-4px) !important; }\r\n    .m8-lp-root .feature-ico { width: 64px !important; height: 64px !important; border-radius: 50% !important; background: linear-gradient(135deg, var(--orange), var(--orange-dark)) !important; margin: 0 auto 16px !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #fff !important; font-size: 24px !important; box-shadow: 0 8px 20px rgba(255,140,0,.24) !important; }\r\n    .m8-lp-root .feature-card h3 { font-size: 18px !important; margin-bottom: 8px !important; }\r\n    .m8-lp-root .feature-card p { font-size: 13px !important; color: #686868 !important; }\r\n\r\n    \/* DEMO TABS *\/\r\n    .m8-lp-root .demo-wrap { background: #fff !important; border: 1px solid var(--line) !important; border-radius: 20px !important; overflow: hidden !important; box-shadow: var(--shadow-lg) !important; }\r\n    .m8-lp-root .demo-tabs { display: flex !important; flex-wrap: wrap !important; border-bottom: 1px solid var(--line) !important; background: #fff !important; }\r\n    .m8-lp-root .demo-tab { padding: 16px 22px !important; border: none !important; background: #fff !important; font-size: 14px !important; font-weight: 600 !important; color: #666 !important; cursor: pointer !important; border-bottom: 3px solid transparent !important; }\r\n    .m8-lp-root .demo-tab.active { color: var(--orange-dark) !important; border-bottom-color: var(--orange-dark) !important; }\r\n    .m8-lp-root .demo-pane { display: none !important; }\r\n    .m8-lp-root .demo-pane.active { display: block !important; }\r\n    .m8-lp-root .demo-pane img { width: 100% !important; display: block !important; }\r\n    .m8-lp-root .demo-caption { display: flex !important; justify-content: space-between !important; align-items: center !important; gap: 16px !important; padding: 20px 24px !important; border-top: 1px solid var(--line) !important; flex-wrap: wrap !important; }\r\n    .m8-lp-root .demo-caption p { font-size: 14px !important; margin: 0 !important; }\r\n\r\n    \/* HOW IT WORKS *\/\r\n    .m8-lp-root .how { background: #171717 !important; }\r\n    .m8-lp-root .how .sec-head h2, .m8-lp-root .how .sec-head p { color: #fff !important; }\r\n    .m8-lp-root .how .sec-head p { color: rgba(255,255,255,.68) !important; }\r\n    .m8-lp-root .how-grid { display: grid !important; grid-template-columns: 1fr 1.2fr !important; gap: 56px !important; align-items: center !important; }\r\n    .m8-lp-root .steps { display: flex !important; flex-direction: column !important; gap: 24px !important; }\r\n    .m8-lp-root .step { display: flex !important; gap: 16px !important; align-items: flex-start !important; }\r\n    .m8-lp-root .step-num { width: 40px !important; height: 40px !important; border-radius: 50% !important; background: linear-gradient(135deg, var(--orange), var(--orange-dark)) !important; color: #fff !important; display: flex !important; align-items: center !important; justify-content: center !important; font-weight: 700 !important; font-size: 16px !important; flex-shrink: 0 !important; }\r\n    .m8-lp-root .step h4 { color: #fff !important; font-size: 18px !important; margin-bottom: 6px !important; }\r\n    .m8-lp-root .step p { color: rgba(255,255,255,.68) !important; font-size: 14px !important; }\r\n    .m8-lp-root .how-visual { background: #0f1013 !important; border: 1px solid rgba(255,255,255,.08) !important; border-radius: 20px !important; padding: 10px !important; box-shadow: 0 20px 60px rgba(0,0,0,.25) !important; }\r\n    .m8-lp-root .how-visual img { width: 100% !important; border-radius: 14px !important; }\r\n\r\n    \/* DIFFERENTIALS *\/\r\n    .m8-lp-root .diff { background: #f9fafb !important; }\r\n    .m8-lp-root .diff-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 60px !important; align-items: center !important; }\r\n    .m8-lp-root .diff-list { display: flex !important; flex-direction: column !important; gap: 16px !important; margin-top: 28px !important; }\r\n    .m8-lp-root .diff-item { display: flex !important; gap: 14px !important; background: #fff !important; border: 1px solid var(--line) !important; padding: 20px !important; border-radius: 16px !important; box-shadow: var(--shadow) !important; }\r\n    .m8-lp-root .diff-check { width: 32px !important; height: 32px !important; border-radius: 50% !important; background: linear-gradient(135deg, var(--orange), var(--orange-dark)) !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #fff !important; flex-shrink: 0 !important; font-size: 12px !important; }\r\n    .m8-lp-root .diff-item h4 { font-size: 16px !important; margin-bottom: 4px !important; }\r\n    .m8-lp-root .diff-item p { font-size: 14px !important; color: #666 !important; }\r\n    .m8-lp-root .diff-stats { display: flex !important; flex-direction: column !important; gap: 16px !important; }\r\n    .m8-lp-root .diff-stat { background: #fff !important; border: 1px solid var(--line) !important; border-radius: 16px !important; padding: 24px !important; text-align: center !important; box-shadow: var(--shadow) !important; }\r\n    .m8-lp-root .diff-stat strong { display: block !important; font-size: 40px !important; font-weight: 700 !important; color: var(--orange-dark) !important; line-height: 1.1 !important; margin-bottom: 8px !important; }\r\n    .m8-lp-root .diff-stat span { font-size: 14px !important; color: #666 !important; }\r\n\r\n    \/* CTA \/ FORM \/ FOOTER *\/\r\n    .m8-lp-root .cta-band { padding: 80px 0 !important; background: linear-gradient(135deg, var(--orange), var(--orange-dark)) !important; text-align: center !important; }\r\n    .m8-lp-root .cta-band h2 { color: #fff !important; font-size: clamp(28px, 3vw, 40px) !important; margin-bottom: 12px !important; }\r\n    .m8-lp-root .cta-band p { max-width: 600px !important; margin: 0 auto 30px !important; color: rgba(255,255,255,.88) !important; font-size: 16px !important; }\r\n    .m8-lp-root .cta-band .cta-actions { display: flex !important; justify-content: center !important; gap: 14px !important; flex-wrap: wrap !important; }\r\n\r\n    .m8-lp-root .form-grid-2 { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 60px !important; align-items: start !important; }\r\n    .m8-lp-root .form-box { background: #fff !important; border: 1px solid var(--line) !important; border-radius: 20px !important; padding: 28px 36px 36px !important; box-shadow: var(--shadow-lg) !important; }\r\n    \/* \u2500\u2500 ALTERA\u00c7\u00c3O: t\u00edtulo mais pr\u00f3ximo do formul\u00e1rio RD \u2500\u2500 *\/\r\n    .m8-lp-root .form-box h3 { font-size: 24px !important; margin-bottom: 6px !important; }\r\n    .m8-lp-root .form-box > #formulario-portal-fce72d265abce3b57996 { margin-top: 4px !important; }\r\n    .m8-lp-root .form-perks { display: flex !important; flex-direction: column !important; gap: 12px !important; margin-top: 24px !important; }\r\n    .m8-lp-root .form-perk { display: flex !important; align-items: center !important; gap: 10px !important; font-size: 14px !important; font-weight: 500 !important; color: #313131 !important; }\r\n    .m8-lp-root .form-perk i { color: var(--orange-dark) !important; }\r\n\r\n    .m8-lp-root .footer { background: #171717 !important; padding: 48px 0 30px !important; text-align: center !important; }\r\n    .m8-lp-root .footer-logo { display: flex !important; justify-content: center !important; margin-bottom: 18px !important; }\r\n    .m8-lp-root .footer-logo img { height: 42px !important; width: auto !important; max-width: 180px !important; object-fit: contain !important; }\r\n    .m8-lp-root .footer p { color: rgba(255,255,255,.6) !important; font-size: 13px !important; margin: 0 !important; }\r\n\r\n    \/* MODAL DE LOGIN *\/\r\n    .m8-lp-root .login-modal-overlay { display: none !important; position: fixed !important; inset: 0 !important; background: rgba(0,0,0,.6) !important; z-index: 10000 !important; align-items: center !important; justify-content: center !important; padding: 20px !important; backdrop-filter: blur(4px) !important; }\r\n    .m8-lp-root .login-modal-overlay.open { display: flex !important; }\r\n    .m8-lp-root .login-modal { width: 100% !important; max-width: 400px !important; background: #fff !important; border-radius: 20px !important; padding: 36px 30px !important; box-shadow: var(--shadow-lg) !important; position: relative !important; text-align: center !important; }\r\n    .m8-lp-root .login-close { position: absolute !important; right: 16px !important; top: 16px !important; width: 32px !important; height: 32px !important; border: none !important; border-radius: 50% !important; background: #f3f4f6 !important; cursor: pointer !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #666 !important; }\r\n    .m8-lp-root .login-modal h3 { font-size: 22px !important; margin-bottom: 8px !important; }\r\n    .m8-lp-root .login-modal p { font-size: 13px !important; color: var(--muted) !important; margin-bottom: 22px !important; }\r\n    .m8-lp-root .login-logo { display: flex !important; justify-content: center !important; margin-bottom: 18px !important; }\r\n    .m8-lp-root .login-logo img { height: 30px !important; }\r\n    .m8-lp-root .login-field { text-align: left !important; }\r\n    .m8-lp-root .login-field label { display: block !important; font-size: 12px !important; font-weight: 600 !important; color: #222 !important; margin-bottom: 8px !important; }\r\n    .m8-lp-root .login-field input { width: 100% !important; border: 1.5px solid var(--line) !important; border-radius: 12px !important; padding: 12px 16px !important; font-size: 14px !important; outline: none !important; }\r\n    .m8-lp-root .login-field input:focus { border-color: var(--orange) !important; }\r\n    .m8-lp-root .preview-url { margin: 14px 0 18px !important; background: var(--orange-soft) !important; border: 1px solid var(--orange-line) !important; border-radius: 10px !important; padding: 10px 14px !important; font-size: 11px !important; color: var(--orange-dark) !important; display: none !important; word-break: break-all !important; text-align: left !important; }\r\n    .m8-lp-root .login-submit { width: 100% !important; border-radius: 12px !important; padding: 14px !important; font-size: 14px !important; margin-top: 10px !important; }\r\n\r\n    \/* =========================================================\r\n       RESPONSIVO OTIMIZADO (MOBILE)\r\n       ========================================================= *\/\r\n    @media (max-width: 1080px) {\r\n      .m8-lp-root .feature-grid { grid-template-columns: repeat(2, 1fr) !important; }\r\n      .m8-lp-root .problem-grid, .m8-lp-root .diff-grid, .m8-lp-root .form-grid-2, .m8-lp-root .how-grid { grid-template-columns: 1fr !important; }\r\n      .m8-lp-root .portal-mock { grid-template-columns: 110px 1fr !important; }\r\n    }\r\n\r\n    @media (max-width: 860px) {\r\n      .m8-lp-root .nav-links { display: none !important; }\r\n      .m8-lp-root .stats-grid { grid-template-columns: repeat(2, 1fr) !important; row-gap: 20px !important; }\r\n\r\n      \/* Mobile Mockup adjustments - Transform Sidebar to Top Row *\/\r\n      .m8-lp-root .portal-mock { grid-template-columns: 1fr !important; min-height: auto !important; border-radius: 16px !important; }\r\n      .m8-lp-root .portal-side { flex-direction: row !important; padding: 12px !important; overflow-x: auto !important; border-right: none !important; border-bottom: 1px solid #e5e7eb !important; align-items: center !important; }\r\n      .m8-lp-root .side-logo, .m8-lp-root .side-footer { display: none !important; }\r\n      .m8-lp-root .side-nav { flex-direction: row !important; gap: 8px !important; margin: 0 !important; }\r\n      .m8-lp-root .side-item { padding: 8px 12px !important; background: #fff !important; border: 1px solid #e5e7eb !important; border-radius: 8px !important; white-space: nowrap !important; }\r\n      .m8-lp-root .side-item.active::before { display: none !important; }\r\n      .m8-lp-root .side-item.active { border-color: var(--orange) !important; background: var(--orange-soft) !important; }\r\n\r\n      .m8-lp-root .dash-grid { grid-template-columns: repeat(2, 1fr) !important; }\r\n      .m8-lp-root .portal-main { padding: 12px !important; }\r\n      .m8-lp-root .portal-shell { padding: 16px !important; }\r\n      .m8-lp-root .hero { padding-top: 116px !important; }\r\n      .m8-lp-root .form-grid { grid-template-columns: 1fr !important; gap: 8px !important; }\r\n      .m8-lp-root .form-grid label { padding-top: 0 !important; margin-bottom: -4px !important; }\r\n      .m8-lp-root .submit-row { grid-column: 1 \/ 2 !important; }\r\n    }\r\n\r\n    @media (max-width: 560px) {\r\n      .m8-lp-root .feature-grid, .m8-lp-root .stats-grid, .m8-lp-root .dash-grid { grid-template-columns: 1fr !important; }\r\n      .m8-lp-root .hero h1 { font-size: 30px !important; }\r\n      .m8-lp-root .sec-head h2 { font-size: 26px !important; }\r\n      .m8-lp-root .how-visual img { min-height: auto !important; }\r\n      .m8-lp-root .form-box { padding: 20px !important; }\r\n      .m8-lp-root .portal-header { flex-direction: column !important; gap: 10px !important; }\r\n      .m8-lp-root .portal-company { width: 100% !important; text-align: left !important; }\r\n      .m8-lp-root .tab-strip { padding-bottom: 12px !important; }\r\n      .m8-lp-root .table-top { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; }\r\n      .m8-lp-root .table-search { width: 100% !important; }\r\n      .m8-lp-root .table-search input { width: 100% !important; }\r\n    }\r\n  <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<!-- ENVOLT\u00d3RIO DE ISOLAMENTO -->\r\n<div class=\"m8-lp-root\">\r\n\r\n  <div class=\"login-modal-overlay\" id=\"loginModal\">\r\n    <div class=\"login-modal\">\r\n      <button class=\"login-close\" onclick=\"closeLogin()\"><i class=\"fa-solid fa-xmark\"><\/i><\/button>\r\n      <div class=\"login-logo\"><img decoding=\"async\" src=\"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2022\/11\/logo_erp.svg\" alt=\"ERP M8\"><\/div>\r\n      <h3>Acessar o Portal<\/h3>\r\n      <p>Informe sua base de dados para entrar<\/p>\r\n      <div class=\"login-field\">\r\n        <label>Base de dados<\/label>\r\n        <input type=\"text\" id=\"baseInput\" placeholder=\"ex: minhaempresa\" oninput=\"updateUrl()\">\r\n      <\/div>\r\n      <div class=\"preview-url\" id=\"urlPreview\"><\/div>\r\n      <button class=\"btn btn-primary login-submit\" onclick=\"goToPortal()\"><i class=\"fa-solid fa-right-to-bracket\"><\/i> Acessar meu portal<\/button>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <nav class=\"navbar\">\r\n    <div class=\"container\">\r\n      <div class=\"nav-inner\">\r\n        <a href=\"#inicio\" class=\"nav-logo\"><img decoding=\"async\" src=\"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2022\/11\/logo_erp.svg\" alt=\"ERP M8\"><\/a>\r\n        <div class=\"nav-links\">\r\n          <a href=\"#funcionalidades\">Funcionalidades<\/a>\r\n          <a href=\"#demo\">Ver Portal<\/a>\r\n          <a href=\"#como-funciona\">Como funciona<\/a>\r\n          <a href=\"#contato\">Contato<\/a>\r\n        <\/div>\r\n        <div class=\"nav-cta\">\r\n          <button class=\"nav-login-btn\" onclick=\"openLogin()\"><i class=\"fa-solid fa-right-to-bracket\"><\/i> Login<\/button>\r\n          <a class=\"nav-demo-btn\" href=\"https:\/\/app.getdemo.com.br\/d\/2d4aea5f-d069-458b-b09b-82e187dbd3c7\" target=\"_blank\"><i class=\"fa-solid fa-play\"><\/i> Demonstra\u00e7\u00e3o Guiada<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/nav>\r\n\r\n  <section class=\"hero\" id=\"inicio\">\r\n    <canvas id=\"heroCanvas\"><\/canvas>\r\n    <div class=\"hero-overlay\"><\/div>\r\n    <div class=\"container\">\r\n      <div class=\"hero-inner\">\r\n        <span class=\"tag\"><i class=\"fa-solid fa-circle\" style=\"font-size:8px\"><\/i> Portal do Cliente \u00b7 ERP M8<\/span>\r\n        <h1>Um portal <span class=\"hl\">moderno<\/span> para conectar sua empresa aos seus clientes<\/h1>\r\n        <p class=\"hero-desc\">Ordens de servi\u00e7o, pedidos, boletos, notas fiscais, contratos e or\u00e7amentos em um ambiente digital claro, intuitivo e integrado ao ERP M8.<\/p>\r\n        <div class=\"hero-actions\">\r\n          <a href=\"#contato\" class=\"btn btn-primary\"><i class=\"fa-solid fa-rocket\"><\/i> Quero conhecer o Portal<\/a>\r\n          <a href=\"https:\/\/app.getdemo.com.br\/d\/2d4aea5f-d069-458b-b09b-82e187dbd3c7\" target=\"_blank\" class=\"btn btn-outline\"><i class=\"fa-solid fa-play\"><\/i> Ver demonstra\u00e7\u00e3o<\/a>\r\n        <\/div>\r\n        <div class=\"hero-badges\">\r\n          <span class=\"hero-badge\"><i class=\"fa-solid fa-shield-halved\"><\/i> 100% seguro<\/span>\r\n          <span class=\"hero-badge\"><i class=\"fa-solid fa-plug\"><\/i> Integrado ao ERP<\/span>\r\n          <span class=\"hero-badge\"><i class=\"fa-solid fa-clock\"><\/i> Acesso 24\/7<\/span>\r\n          <span class=\"hero-badge\"><i class=\"fa-solid fa-layer-group\"><\/i> 7 Funcionalidades dispon\u00edveis<\/span>\r\n        <\/div>\r\n\r\n        <div class=\"portal-mock-wrap\">\r\n          <div class=\"portal-mock-glow\"><\/div>\r\n          <div class=\"portal-mock\">\r\n            <aside class=\"portal-side\">\r\n              <div class=\"side-logo\"><img decoding=\"async\" src=\"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2025\/09\/logo1.svg\" alt=\"ERP M8 Cloud\"><\/div>\r\n              <div class=\"side-nav\">\r\n                <div class=\"side-item active\" data-screen=\"dashboard\"><span class=\"side-ico\"><i class=\"fa-solid fa-table-cells-large\"><\/i><\/span><span>\u00c1rea de Trabalho<\/span><\/div>\r\n                <div class=\"side-item\" data-screen=\"os\"><span class=\"side-ico\"><i class=\"fa-solid fa-screwdriver-wrench\"><\/i><\/span><span>Ordem de Servi\u00e7o<\/span><\/div>\r\n                <div class=\"side-item\" data-screen=\"nf\"><span class=\"side-ico\"><i class=\"fa-solid fa-file-code\"><\/i><\/span><span>Nota Fiscal<\/span><\/div>\r\n                <div class=\"side-item\" data-screen=\"titulo\"><span class=\"side-ico\"><i class=\"fa-solid fa-dollar-sign\"><\/i><\/span><span>T\u00edtulo<\/span><\/div>\r\n                <div class=\"side-item\" data-screen=\"pedido\"><span class=\"side-ico\"><i class=\"fa-solid fa-cart-shopping\"><\/i><\/span><span>Pedido<\/span><\/div>\r\n                <div class=\"side-item\" data-screen=\"estoque\"><span class=\"side-ico\"><i class=\"fa-solid fa-box-open\"><\/i><\/span><span>Estoque<\/span><\/div>\r\n                <div class=\"side-item\" data-screen=\"contrato\"><span class=\"side-ico\"><i class=\"fa-solid fa-file-signature\"><\/i><\/span><span>Contrato<\/span><\/div>\r\n                <div class=\"side-item\" data-screen=\"orcamento\"><span class=\"side-ico\"><i class=\"fa-solid fa-file-invoice-dollar\"><\/i><\/span><span>Or\u00e7amento<\/span><\/div>\r\n              <\/div>\r\n              <div class=\"side-footer\">\r\n                <div class=\"side-user\"><span class=\"avatar\"><i class=\"fa-solid fa-user\"><\/i><\/span><span>Usu\u00e1rio<br>C\u00f3d. Estab. 1<\/span><\/div>\r\n                <div class=\"side-btn\"><i class=\"fa-solid fa-right-from-bracket\"><\/i> Desconectar<\/div>\r\n                <div class=\"side-copy\">\u00a9 2026 M8 Sistemas<br>Todos os direitos reservados.<\/div>\r\n              <\/div>\r\n            <\/aside>\r\n\r\n            <main class=\"portal-main\">\r\n              <div class=\"portal-shell\">\r\n                <div class=\"portal-header\">\r\n                  <div class=\"portal-title\">\r\n                    <h4>Ol\u00e1, Usu\u00e1rio<\/h4>\r\n                    <p>10 de abril de 2026 \u00e0s 14:31<\/p>\r\n                  <\/div>\r\n                  <div class=\"portal-company\">5000 - Empresa LTDA \u00b7 12.345.678\/0001-99 &nbsp;<i class=\"fa-solid fa-chevron-down\" style=\"font-size:9px;color:#9ca3af\"><\/i><\/div>\r\n                <\/div>\r\n\r\n                <div class=\"mock-screen active\" id=\"screen-dashboard\">\r\n                  <div class=\"tab-strip\">\r\n                    <span class=\"tab-chip\">\u00c1rea de Trabalho<\/span>\r\n                  <\/div>\r\n                  <div class=\"dash-grid\">\r\n                    <div class=\"dash-card\" data-screen-go=\"os\"><div class=\"dash-ico\"><i class=\"fa-solid fa-screwdriver-wrench\"><\/i><\/div><span>ORDEM DE SERVI\u00c7O<\/span><\/div>\r\n                    <div class=\"dash-card\" data-screen-go=\"nf\"><div class=\"dash-ico\">XML<\/div><span>NOTA FISCAL<\/span><\/div>\r\n                    <div class=\"dash-card\" data-screen-go=\"titulo\"><div class=\"dash-ico\"><i class=\"fa-solid fa-dollar-sign\"><\/i><\/div><span>T\u00cdTULO<\/span><\/div>\r\n                    <div class=\"dash-card\" data-screen-go=\"pedido\"><div class=\"dash-ico\"><i class=\"fa-solid fa-cart-shopping\"><\/i><\/div><span>PEDIDO<\/span><\/div>\r\n                    <div class=\"dash-card\" data-screen-go=\"estoque\"><div class=\"dash-ico\"><i class=\"fa-solid fa-box-open\"><\/i><\/div><span>ESTOQUE<\/span><\/div>\r\n                    <div class=\"dash-card\" data-screen-go=\"contrato\"><div class=\"dash-ico\"><i class=\"fa-solid fa-file-signature\"><\/i><\/div><span>CONTRATO<\/span><\/div>\r\n                    <div class=\"dash-card\" data-screen-go=\"orcamento\"><div class=\"dash-ico\"><i class=\"fa-solid fa-file-invoice-dollar\"><\/i><\/div><span>OR\u00c7AMENTO<\/span><\/div>\r\n                  <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"mock-screen\" id=\"screen-contrato\">\r\n                  <div class=\"tab-strip\">\r\n                    <span class=\"tab-chip\">\u00c1rea de Trabalho<\/span>\r\n                    <span class=\"tab-chip active\">Contrato <i class=\"fa-solid fa-xmark\"><\/i><\/span>\r\n                    <span class=\"tab-chip\">Estoque <i class=\"fa-solid fa-xmark\"><\/i><\/span>\r\n                    <span class=\"tab-chip\">Pedido <i class=\"fa-solid fa-xmark\"><\/i><\/span>\r\n                  <\/div>\r\n                  <div class=\"table-top\">\r\n                    <div><\/div>\r\n                    <div>\r\n                      <div class=\"table-search\">\r\n                        <input type=\"text\" placeholder=\"C\u00f3digo\">\r\n                        <button><i class=\"fa-solid fa-magnifying-glass\"><\/i> Pesquisar<\/button>\r\n                      <\/div>\r\n                      <div class=\"table-meta\">13 registro(s)<\/div>\r\n                    <\/div>\r\n                  <\/div>\r\n                  <div class=\"table-responsive\">\r\n                    <table class=\"portal-table\">\r\n                      <thead>\r\n                        <tr>\r\n                          <th class=\"tcenter\">A\u00e7\u00f5es<\/th>\r\n                          <th>C\u00f3digo<\/th>\r\n                          <th>Descri\u00e7\u00e3o<\/th>\r\n                          <th>Tipo Contrato<\/th>\r\n                          <th class=\"tcenter\">Status<\/th>\r\n                          <th class=\"tcenter\">Aprova\u00e7\u00e3o<\/th>\r\n                          <th>Data In\u00edcio<\/th>\r\n                          <th>Valor<\/th>\r\n                        <\/tr>\r\n                      <\/thead>\r\n                      <tbody>\r\n                        <tr><td class=\"tcenter\"><i class=\"fa-solid fa-print\"><\/i><\/td><td>35<\/td><td>TESTE<\/td><td>COMPRAS<\/td><td class=\"tcenter\"><span class=\"pill green\">Processado<\/span><\/td><td class=\"tcenter\"><span class=\"pill green\">Aprovada<\/span><\/td><td>07\/02\/2025<\/td><td>100.000,00<\/td><\/tr>\r\n                        <tr><td class=\"tcenter\"><i class=\"fa-solid fa-print\"><\/i><\/td><td>34<\/td><td>teste<\/td><td>COMPRAS<\/td><td class=\"tcenter\"><span class=\"pill green\">Processado<\/span><\/td><td class=\"tcenter\"><span class=\"pill green\">Aprovada<\/span><\/td><td>31\/01\/2025<\/td><td>10.000,00<\/td><\/tr>\r\n                        <tr><td class=\"tcenter\"><i class=\"fa-solid fa-print\"><\/i><\/td><td>33<\/td><td>teste<\/td><td>COMPRAS<\/td><td class=\"tcenter\"><span class=\"pill yellow\">Pendente<\/span><\/td><td class=\"tcenter\"><span class=\"pill yellow\">Aguardando Aprova\u00e7\u00e3o<\/span><\/td><td>31\/01\/2025<\/td><td>10.000,00<\/td><\/tr>\r\n                        <tr><td class=\"tcenter\"><i class=\"fa-solid fa-print\"><\/i><\/td><td>30<\/td><td>Teste prod.<\/td><td>VENDA DE MERCADORIA<\/td><td class=\"tcenter\"><span class=\"pill green\">Processado<\/span><\/td><td class=\"tcenter\"><span class=\"pill green\">Aprovada<\/span><\/td><td>01\/09\/2024<\/td><td>120.000,00<\/td><\/tr>\r\n                      <\/tbody>\r\n                    <\/table>\r\n                  <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"mock-screen\" id=\"screen-os\">\r\n                  <div class=\"tab-strip\">\r\n                    <span class=\"tab-chip\">\u00c1rea de Trabalho<\/span>\r\n                    <span class=\"tab-chip active\">Ordem de Servi\u00e7o: Novo <i class=\"fa-solid fa-xmark\"><\/i><\/span>\r\n                  <\/div>\r\n                  <div class=\"form-grid\">\r\n                    <label>Tipo Ordem Servi\u00e7o<\/label><select class=\"select\"><option>2 - MANUTEN\u00c7\u00c3O DE EQUIPAMENTOS...<\/option><\/select>\r\n                    <label>Data Abertura<\/label><input class=\"input\" value=\"10\/04\/2026\">\r\n                    <label>Equipamento<\/label><select class=\"select\"><option>11 - Vector 8500 Marca Digitadora...<\/option><\/select>\r\n                    <label>Defeito<\/label><select class=\"select\"><option>1 - DISPLAY N\u00c3O LIGA<\/option><\/select>\r\n                    <label>Telefone<\/label><input class=\"input\" placeholder=\"Telefone\">\r\n                    <label>Motivo do Chamado<\/label><textarea class=\"textarea\" placeholder=\"Motivo do Chamado\"><\/textarea>\r\n                    <label>Problema<\/label><textarea class=\"textarea\" placeholder=\"Problema\"><\/textarea>\r\n                    <div class=\"submit-row\" style=\"text-align: right;\"><button class=\"mock-submit\">Abrir Ordem de Servi\u00e7o<\/button><\/div>\r\n                  <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"mock-screen\" id=\"screen-orcamento\">\r\n                  <div class=\"tab-strip\">\r\n                    <span class=\"tab-chip\">\u00c1rea de Trabalho<\/span>\r\n                    <span class=\"tab-chip active\">Or\u00e7amento <i class=\"fa-solid fa-xmark\"><\/i><\/span>\r\n                  <\/div>\r\n                  <div class=\"table-top\">\r\n                    <div><\/div>\r\n                    <div>\r\n                      <div class=\"table-search\">\r\n                        <input type=\"text\" placeholder=\"C\u00f3digo\">\r\n                        <button><i class=\"fa-solid fa-magnifying-glass\"><\/i> Pesquisar<\/button>\r\n                      <\/div>\r\n                      <div class=\"table-meta\">35 registro(s)<\/div>\r\n                    <\/div>\r\n                  <\/div>\r\n                  <div class=\"table-responsive\">\r\n                    <table class=\"portal-table\">\r\n                      <thead>\r\n                        <tr>\r\n                          <th class=\"tcenter\">A\u00e7\u00f5es<\/th>\r\n                          <th>C\u00f3digo<\/th>\r\n                          <th class=\"tcenter\">Status<\/th>\r\n                          <th class=\"tcenter\">Aprova\u00e7\u00e3o<\/th>\r\n                          <th>Vendedor<\/th>\r\n                          <th>Emiss\u00e3o<\/th>\r\n                          <th>Total<\/th>\r\n                        <\/tr>\r\n                      <\/thead>\r\n                      <tbody>\r\n                        <tr><td class=\"tcenter\"><i class=\"fa-solid fa-print\"><\/i><\/td><td>1069<\/td><td class=\"tcenter\"><span class=\"pill yellow\">Pendente<\/span><\/td><td class=\"tcenter\"><span class=\"pill yellow\">Aguardando Aprova\u00e7\u00e3o<\/span><\/td><td>ISABELA<\/td><td>02\/04\/2026<\/td><td>120,00<\/td><\/tr>\r\n                        <tr><td class=\"tcenter\"><i class=\"fa-solid fa-print\"><\/i><\/td><td>1067<\/td><td class=\"tcenter\"><span class=\"pill green\">Processado<\/span><\/td><td class=\"tcenter\"><span class=\"pill green\">Aprovada<\/span><\/td><td>ISABELA<\/td><td>30\/03\/2026<\/td><td>363,52<\/td><\/tr>\r\n                        <tr><td class=\"tcenter\"><i class=\"fa-solid fa-print\"><\/i><\/td><td>1066<\/td><td class=\"tcenter\"><span class=\"pill yellow\">Pendente<\/span><\/td><td class=\"tcenter\"><span class=\"pill yellow\">Aguardando Aprova\u00e7\u00e3o<\/span><\/td><td>ISABELA<\/td><td>29\/10\/2025<\/td><td>1.124,55<\/td><\/tr>\r\n                      <\/tbody>\r\n                    <\/table>\r\n                  <\/div>\r\n                <\/div>\r\n\r\n                <!-- Modulos gen\u00e9ricos s\u00f3 pro clique funcionar macio -->\r\n                <div class=\"mock-screen\" id=\"screen-nf\"><div class=\"tab-strip\"><span class=\"tab-chip\">\u00c1rea de Trabalho<\/span><span class=\"tab-chip active\">Nota Fiscal <i class=\"fa-solid fa-xmark\"><\/i><\/span><\/div><p style=\"padding: 20px; font-size: 12px; color: #666;\">M\u00f3dulo de Notas Fiscais.<\/p><\/div>\r\n                <div class=\"mock-screen\" id=\"screen-titulo\"><div class=\"tab-strip\"><span class=\"tab-chip\">\u00c1rea de Trabalho<\/span><span class=\"tab-chip active\">T\u00edtulo <i class=\"fa-solid fa-xmark\"><\/i><\/span><\/div><p style=\"padding: 20px; font-size: 12px; color: #666;\">M\u00f3dulo de T\u00edtulos.<\/p><\/div>\r\n                <div class=\"mock-screen\" id=\"screen-pedido\"><div class=\"tab-strip\"><span class=\"tab-chip\">\u00c1rea de Trabalho<\/span><span class=\"tab-chip active\">Pedido <i class=\"fa-solid fa-xmark\"><\/i><\/span><\/div><p style=\"padding: 20px; font-size: 12px; color: #666;\">M\u00f3dulo de Pedidos.<\/p><\/div>\r\n                <div class=\"mock-screen\" id=\"screen-estoque\"><div class=\"tab-strip\"><span class=\"tab-chip\">\u00c1rea de Trabalho<\/span><span class=\"tab-chip active\">Estoque <i class=\"fa-solid fa-xmark\"><\/i><\/span><\/div><p style=\"padding: 20px; font-size: 12px; color: #666;\">M\u00f3dulo de Estoque.<\/p><\/div>\r\n              <\/div>\r\n            <\/main>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <div class=\"stats\">\r\n    <div class=\"container\">\r\n      <div class=\"stats-grid\">\r\n        <div class=\"stat\"><strong>100%<\/strong><span>Integrado ao ERP M8<\/span><\/div>\r\n        <div class=\"stat\"><strong>24\/7<\/strong><span>Dispon\u00edvel para seus clientes<\/span><\/div>\r\n        <div class=\"stat\"><strong>7<\/strong><span>Funcionalidades dispon\u00edveis<\/span><\/div>\r\n        <div class=\"stat\"><strong>-80%<\/strong><span>Redu\u00e7\u00e3o em chamados manuais<\/span><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <section class=\"section\">\r\n    <div class=\"container\">\r\n      <div class=\"problem-grid\">\r\n        <div>\r\n          <span class=\"tag\"><i class=\"fa-solid fa-triangle-exclamation\"><\/i> O Problema<\/span>\r\n          <h2>Seu atendimento ainda \u00e9 <span style=\"color:var(--orange-dark)\">descentralizado<\/span>?<\/h2>\r\n          <p>E-mails, liga\u00e7\u00f5es e mensagens soltas geram retrabalho, lentid\u00e3o e desgaste com seus clientes.<\/p>\r\n          <div class=\"problem-list\">\r\n            <div class=\"problem-item\"><i class=\"fa-solid fa-circle-xmark\"><\/i><span>Clientes ligam para saber status de pedidos e chamados<\/span><\/div>\r\n            <div class=\"problem-item\"><i class=\"fa-solid fa-circle-xmark\"><\/i><span>Segunda via de boleto depende sempre do financeiro<\/span><\/div>\r\n            <div class=\"problem-item\"><i class=\"fa-solid fa-circle-xmark\"><\/i><span>Notas fiscais e contratos ficam dispersos<\/span><\/div>\r\n            <div class=\"problem-item\"><i class=\"fa-solid fa-circle-xmark\"><\/i><span>Falta visibilidade e autonomia para o cliente<\/span><\/div>\r\n            <div class=\"problem-item\"><i class=\"fa-solid fa-circle-xmark\"><\/i><span>Seu time perde tempo com demandas repetitivas<\/span><\/div>\r\n          <\/div>\r\n          <a href=\"#contato\" class=\"btn btn-primary\">Quero resolver isso<\/a>\r\n        <\/div>\r\n        <div>\r\n          <span class=\"tag\"><i class=\"fa-solid fa-circle-check\"><\/i> A Solu\u00e7\u00e3o<\/span>\r\n          <h2>Tudo centralizado em um portal <span style=\"color:var(--orange-dark)\">\u00fanico<\/span><\/h2>\r\n          <div class=\"sol-cards\">\r\n            <div class=\"sol-card\"><div class=\"sol-icon\"><i class=\"fa-solid fa-screwdriver-wrench\"><\/i><\/div><div><h4>Ordens de Servi\u00e7o online<\/h4><p>Seu cliente abre e acompanha chamados com total transpar\u00eancia.<\/p><\/div><\/div>\r\n            <div class=\"sol-card\"><div class=\"sol-icon\"><i class=\"fa-solid fa-receipt\"><\/i><\/div><div><h4>Boletos e notas fiscais em um clique<\/h4><p>Documentos sempre dispon\u00edveis, sem depender do seu time.<\/p><\/div><\/div>\r\n            <div class=\"sol-card\"><div class=\"sol-icon\"><i class=\"fa-solid fa-file-signature\"><\/i><\/div><div><h4>Contratos e or\u00e7amentos organizados<\/h4><p>Mais autonomia e muito mais confian\u00e7a para o cliente.<\/p><\/div><\/div>\r\n            <div class=\"sol-card\"><div class=\"sol-icon\"><i class=\"fa-solid fa-box-open\"><\/i><\/div><div><h4>Consulta de estoque e pedidos<\/h4><p>Informa\u00e7\u00f5es atualizadas direto do ERP M8.<\/p><\/div><\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <section class=\"section features\" id=\"funcionalidades\">\r\n    <div class=\"container\">\r\n      <div class=\"sec-head\">\r\n        <span class=\"tag\"><i class=\"fa-solid fa-layer-group\"><\/i> Funcionalidades<\/span>\r\n        <h2>Tudo o que seu cliente precisa, em <span style=\"color:var(--orange-dark)\">um s\u00f3 lugar<\/span><\/h2>\r\n        <p>7 funcionalidades completas integradas ao ERP M8 para entregar mais autonomia, agilidade e organiza\u00e7\u00e3o.<\/p>\r\n      <\/div>\r\n      <div class=\"feature-grid\">\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-screwdriver-wrench\"><\/i><\/div><h3>Ordem de Servi\u00e7o<\/h3><p>Abertura e acompanhamento de chamados em tempo real.<\/p><\/div>\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-file-code\"><\/i><\/div><h3>Nota Fiscal<\/h3><p>Visualiza\u00e7\u00e3o e download r\u00e1pido dos documentos fiscais.<\/p><\/div>\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-dollar-sign\"><\/i><\/div><h3>T\u00edtulos<\/h3><p>Consulta de boletos, t\u00edtulos em aberto e hist\u00f3rico financeiro.<\/p><\/div>\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-cart-shopping\"><\/i><\/div><h3>Pedidos<\/h3><p>Hist\u00f3rico completo e acompanhamento do andamento dos pedidos.<\/p><\/div>\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-box-open\"><\/i><\/div><h3>Estoque<\/h3><p>Consulta de disponibilidade de produtos sem precisar ligar.<\/p><\/div>\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-file-signature\"><\/i><\/div><h3>Contrato<\/h3><p>Controle de contratos, vig\u00eancias e aprova\u00e7\u00f5es em um s\u00f3 ambiente.<\/p><\/div>\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-file-invoice-dollar\"><\/i><\/div><h3>Or\u00e7amento<\/h3><p>Visualiza\u00e7\u00e3o e aprova\u00e7\u00e3o direta pelo portal.<\/p><\/div>\r\n        <div class=\"feature-card\"><div class=\"feature-ico\"><i class=\"fa-solid fa-table-cells-large\"><\/i><\/div><h3>\u00c1rea de Trabalho<\/h3><p>Vis\u00e3o geral com acesso r\u00e1pido a tudo o que importa.<\/p><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <section class=\"section how\" id=\"como-funciona\">\r\n    <div class=\"container\">\r\n      <div class=\"sec-head\">\r\n        <span class=\"tag\"><i class=\"fa-solid fa-map\"><\/i> Como funciona<\/span>\r\n        <h2>Simples de ativar. Poderoso no dia a dia.<\/h2>\r\n        <p>Em poucos passos, sua empresa j\u00e1 oferece uma experi\u00eancia digital completa para seus clientes.<\/p>\r\n      <\/div>\r\n      <div class=\"how-grid\">\r\n        <div class=\"steps\">\r\n          <div class=\"step\"><div class=\"step-num\">1<\/div><div><h4>Ativa\u00e7\u00e3o do portal<\/h4><p>Sua empresa ativa o Portal integrado ao ERP M8 com implanta\u00e7\u00e3o r\u00e1pida.<\/p><\/div><\/div>\r\n          <div class=\"step\"><div class=\"step-num\">2<\/div><div><h4>Configura\u00e7\u00e3o de acessos<\/h4><p>Voc\u00ea define quais clientes acessam e quais funcionalidades cada um pode usar.<\/p><\/div><\/div>\r\n          <div class=\"step\"><div class=\"step-num\">3<\/div><div><h4>Login seguro do cliente<\/h4><p>Cada cliente entra no pr\u00f3prio portal com acesso organizado e simples.<\/p><\/div><\/div>\r\n          <div class=\"step\"><div class=\"step-num\">4<\/div><div><h4>Informa\u00e7\u00f5es atualizadas<\/h4><p>Pedidos, documentos, contratos e chamados refletidos em tempo real pelo ERP.<\/p><\/div><\/div>\r\n        <\/div>\r\n        <div class=\"how-visual\">\r\n          <img decoding=\"async\" src=\"https:\/\/cdn.tess.im\/assets\/uploads\/a9f18a71-6ccd-4bdf-9dbb-1d00c77f1040.png\" alt=\"Portal do Cliente em uso\">\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <section class=\"section diff\">\r\n    <div class=\"container\">\r\n      <div class=\"diff-grid\">\r\n        <div>\r\n          <span class=\"tag\"><i class=\"fa-solid fa-bolt\"><\/i> Diferenciais<\/span>\r\n          <h2>Por que escolher o <span style=\"color:var(--orange-dark)\">Portal ERP M8<\/span>?<\/h2>\r\n          <p>Empresas que usam o portal reduzem retrabalho, melhoram o atendimento e entregam mais autonomia ao cliente.<\/p>\r\n          <div class=\"diff-list\">\r\n            <div class=\"diff-item\"><div class=\"diff-check\"><i class=\"fa-solid fa-check\"><\/i><\/div><div><h4>Menos demandas repetitivas<\/h4><p>Seu time deixa de responder tarefas operacionais todos os dias.<\/p><\/div><\/div>\r\n            <div class=\"diff-item\"><div class=\"diff-check\"><i class=\"fa-solid fa-check\"><\/i><\/div><div><h4>Transpar\u00eancia nas informa\u00e7\u00f5es<\/h4><p>Seu cliente acompanha tudo com muito mais confian\u00e7a.<\/p><\/div><\/div>\r\n            <div class=\"diff-item\"><div class=\"diff-check\"><i class=\"fa-solid fa-check\"><\/i><\/div><div><h4>Atendimento 24 horas<\/h4><p>O portal continua funcionando mesmo fora do hor\u00e1rio comercial.<\/p><\/div><\/div>\r\n            <div class=\"diff-item\"><div class=\"diff-check\"><i class=\"fa-solid fa-check\"><\/i><\/div><div><h4>Integra\u00e7\u00e3o real com o ERP M8<\/h4><p>Informa\u00e7\u00f5es consistentes, atualizadas e sem retrabalho manual.<\/p><\/div><\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"diff-stats\">\r\n          <div class=\"diff-stat\"><strong>-80%<\/strong><span>Redu\u00e7\u00e3o em chamados manuais de atendimento<\/span><\/div>\r\n          <div class=\"diff-stat\"><strong>24h<\/strong><span>Disponibilidade cont\u00ednua para seus clientes<\/span><\/div>\r\n          <div class=\"diff-stat\"><strong>7+<\/strong><span>Funcionalidades integradas ao ERP M8<\/span><\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <section class=\"cta-band\">\r\n    <div class=\"container\">\r\n      <h2>Leve seu atendimento a outro n\u00edvel<\/h2>\r\n      <p>Ofere\u00e7a mais autonomia, seguran\u00e7a e transpar\u00eancia para os clientes da sua empresa com o Portal do Cliente ERP M8.<\/p>\r\n      <div class=\"cta-actions\">\r\n        <a href=\"#contato\" class=\"btn btn-white\"><i class=\"fa-solid fa-rocket\"><\/i> Quero conhecer o Portal<\/a>\r\n        <a href=\"https:\/\/app.getdemo.com.br\/d\/2d4aea5f-d069-458b-b09b-82e187dbd3c7\" target=\"_blank\" class=\"btn btn-outline\"><i class=\"fa-solid fa-play\"><\/i> Ver demonstra\u00e7\u00e3o guiada<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <section class=\"section\" id=\"contato\">\r\n    <div class=\"container\">\r\n      <div class=\"form-grid-2\">\r\n        <div>\r\n          <span class=\"tag\"><i class=\"fa-solid fa-envelope\"><\/i> Fale conosco<\/span>\r\n          <h2>D\u00ea o pr\u00f3ximo passo para modernizar seu atendimento<\/h2>\r\n          <p>Preencha o formul\u00e1rio e nossa equipe entrar\u00e1 em contato para apresentar o Portal do Cliente ideal para a sua empresa.<\/p>\r\n          <div class=\"form-perks\">\r\n            <div class=\"form-perk\"><i class=\"fa-solid fa-circle-check\"><\/i> Demonstra\u00e7\u00e3o personalizada e gratuita<\/div>\r\n            <div class=\"form-perk\"><i class=\"fa-solid fa-circle-check\"><\/i> Integra\u00e7\u00e3o completa com o ERP M8<\/div>\r\n            <div class=\"form-perk\"><i class=\"fa-solid fa-circle-check\"><\/i> Suporte de implanta\u00e7\u00e3o<\/div>\r\n            <div class=\"form-perk\"><i class=\"fa-solid fa-circle-check\"><\/i> Retorno r\u00e1pido do time comercial<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"form-box\">\r\n          <h3>Solicite sua demonstra\u00e7\u00e3o<\/h3>\r\n          <div role=\"main\" id=\"formulario-portal-fce72d265abce3b57996\"><\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <footer class=\"footer\">\r\n    <div class=\"container\">\r\n      <div class=\"footer-logo\"><img decoding=\"async\" src=\"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2021\/06\/erp-m8-branca-sem-slogan.png\" alt=\"ERP M8\"><\/div>\r\n      <p>\u00a9 2026 ERP M8 \u00b7 M8 Sistemas. Todos os direitos reservados.<\/p>\r\n    <\/div>\r\n  <\/footer>\r\n\r\n<\/div> <!-- FIM .m8-lp-root -->\r\n\r\n<script src=\"https:\/\/d335luupugsy2.cloudfront.net\/js\/rdstation-forms\/stable\/rdstation-forms.min.js\"><\/script>\r\n<script>\r\n  new RDStationForms('formulario-portal-fce72d265abce3b57996','UA-114910117-4').createForm();\r\n\r\n  function openLogin(){document.getElementById('loginModal').classList.add('open');document.body.style.overflow='hidden'}\r\n  function closeLogin(){document.getElementById('loginModal').classList.remove('open');document.body.style.overflow=''}\r\n  document.getElementById('loginModal').addEventListener('click',function(e){if(e.target===this)closeLogin()})\r\n\r\n  function updateUrl(){\r\n    var base=document.getElementById('baseInput').value.trim();\r\n    var preview=document.getElementById('urlPreview');\r\n    if(base){preview.style.display='block';preview.innerHTML='https:\/\/portal.m8.tec.br\/<strong>'+base+'<\/strong>\/login'}\r\n    else{preview.style.display='none'}\r\n  }\r\n  function goToPortal(){\r\n    var base=document.getElementById('baseInput').value.trim();\r\n    if(!base){document.getElementById('baseInput').focus();return}\r\n    window.open('https:\/\/portal.m8.tec.br\/'+base+'\/login','_blank')\r\n  }\r\n\r\n  function activateMock(screen){\r\n    document.querySelectorAll('.m8-lp-root .side-item').forEach(function(el){el.classList.remove('active')});\r\n    document.querySelectorAll('.m8-lp-root .mock-screen').forEach(function(el){el.classList.remove('active')});\r\n    var side = document.querySelector('.m8-lp-root .side-item[data-screen=\"'+screen+'\"]');\r\n    var pane = document.getElementById('screen-'+screen);\r\n    if(side) side.classList.add('active');\r\n    if(pane) pane.classList.add('active');\r\n  }\r\n\r\n  document.querySelectorAll('.m8-lp-root .side-item').forEach(function(item){\r\n    item.addEventListener('click',function(){activateMock(this.getAttribute('data-screen'))})\r\n  });\r\n\r\n  document.querySelectorAll('.m8-lp-root .dash-card').forEach(function(item){\r\n    item.addEventListener('click',function(){activateMock(this.getAttribute('data-screen-go'))})\r\n  });\r\n\r\n  \/\/ Canvas Particles\r\n  (function(){\r\n    var canvas=document.getElementById('heroCanvas');\r\n    if(!canvas) return;\r\n    var ctx=canvas.getContext('2d');\r\n    var particles=[]; var w,h;\r\n    function resize(){w=canvas.width=canvas.offsetWidth;h=canvas.height=canvas.offsetHeight}\r\n    resize(); window.addEventListener('resize',resize);\r\n    for(var i=0;i<56;i++)particles.push({x:Math.random()*w,y:Math.random()*h,r:Math.random()*2.2+.5,dx:(Math.random()-.5)*.35,dy:(Math.random()-.5)*.35,a:Math.random()*.35+.08});\r\n    function draw(){\r\n      ctx.clearRect(0,0,w,h);\r\n      particles.forEach(function(p){\r\n        p.x+=p.dx; p.y+=p.dy;\r\n        if(p.x<0||p.x>w)p.dx*=-1;\r\n        if(p.y<0||p.y>h)p.dy*=-1;\r\n        ctx.beginPath(); ctx.arc(p.x,p.y,p.r,0,Math.PI*2); ctx.fillStyle='rgba(255,140,0,'+p.a+')'; ctx.fill();\r\n      });\r\n      for(var i=0;i<particles.length;i++){\r\n        for(var j=i+1;j<particles.length;j++){\r\n          var dx=particles[i].x-particles[j].x, dy=particles[i].y-particles[j].y, d=Math.sqrt(dx*dx+dy*dy);\r\n          if(d<120){ctx.beginPath();ctx.moveTo(particles[i].x,particles[i].y);ctx.lineTo(particles[j].x,particles[j].y);ctx.strokeStyle='rgba(255,140,0,'+(0.06*(1-d\/120))+')';ctx.lineWidth=.8;ctx.stroke()}\r\n        }\r\n      }\r\n      requestAnimationFrame(draw);\r\n    }\r\n    draw();\r\n  })();\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Portal do Cliente | ERP M8 Acessar o Portal Informe sua base de dados para entrar Base de dados Acessar meu portal Funcionalidades Ver Portal Como funciona Contato Login Demonstra\u00e7\u00e3o Guiada Portal do Cliente \u00b7 ERP M8 Um portal moderno para conectar sua empresa aos seus clientes Ordens de servi\u00e7o, pedidos, boletos, notas fiscais, contratos &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/\"> <span class=\"screen-reader-text\">portal-do-cliente<\/span> Leia mais &raquo;<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"ai_generated_summary":"","footnotes":""},"class_list":["post-9253","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v19.1 (Yoast SEO v28.1) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>portal-do-cliente - ERP M8<\/title>\n<meta name=\"robots\" content=\"noindex, follow\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"portal-do-cliente\" \/>\n<meta property=\"og:description\" content=\"Portal do Cliente | ERP M8 Acessar o Portal Informe sua base de dados para entrar Base de dados Acessar meu portal Funcionalidades Ver Portal Como funciona Contato Login Demonstra\u00e7\u00e3o Guiada Portal do Cliente \u00b7 ERP M8 Um portal moderno para conectar sua empresa aos seus clientes Ordens de servi\u00e7o, pedidos, boletos, notas fiscais, contratos &hellip; portal-do-cliente Leia mais &raquo;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/\" \/>\n<meta property=\"og:site_name\" content=\"ERP M8\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/m8sistemas\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-26T10:56:04+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2022\/11\/logo_erp.svg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/\",\"url\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/\",\"name\":\"portal-do-cliente - ERP M8\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/logo_erp.svg\",\"datePublished\":\"2025-09-24T16:37:17+00:00\",\"dateModified\":\"2026-06-26T10:56:04+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/#primaryimage\",\"url\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/logo_erp.svg\",\"contentUrl\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/logo_erp.svg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/portal-do-cliente\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"portal-do-cliente\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/#website\",\"url\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/\",\"name\":\"ERP M8.Cloud\",\"description\":\"Completo Sistema de Gest\u00e3o ERP\",\"publisher\":{\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/#organization\",\"name\":\"ERP M8 CLOUD\",\"url\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/logo-6.png\",\"contentUrl\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/logo-6.png\",\"width\":125,\"height\":54,\"caption\":\"ERP M8 CLOUD\"},\"image\":{\"@id\":\"https:\\\/\\\/erpm8.cloud\\\/2021\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/m8sistemas\",\"https:\\\/\\\/instagram.com\\\/m8sistemas\"]}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"portal-do-cliente - ERP M8","robots":{"index":"noindex","follow":"follow"},"og_locale":"pt_BR","og_type":"article","og_title":"portal-do-cliente","og_description":"Portal do Cliente | ERP M8 Acessar o Portal Informe sua base de dados para entrar Base de dados Acessar meu portal Funcionalidades Ver Portal Como funciona Contato Login Demonstra\u00e7\u00e3o Guiada Portal do Cliente \u00b7 ERP M8 Um portal moderno para conectar sua empresa aos seus clientes Ordens de servi\u00e7o, pedidos, boletos, notas fiscais, contratos &hellip; portal-do-cliente Leia mais &raquo;","og_url":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/","og_site_name":"ERP M8","article_publisher":"https:\/\/www.facebook.com\/m8sistemas","article_modified_time":"2026-06-26T10:56:04+00:00","og_image":[{"url":"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2022\/11\/logo_erp.svg","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. tempo de leitura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/","url":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/","name":"portal-do-cliente - ERP M8","isPartOf":{"@id":"https:\/\/erpm8.cloud\/2021\/#website"},"primaryImageOfPage":{"@id":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/#primaryimage"},"image":{"@id":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/#primaryimage"},"thumbnailUrl":"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2022\/11\/logo_erp.svg","datePublished":"2025-09-24T16:37:17+00:00","dateModified":"2026-06-26T10:56:04+00:00","breadcrumb":{"@id":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/#primaryimage","url":"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2022\/11\/logo_erp.svg","contentUrl":"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2022\/11\/logo_erp.svg"},{"@type":"BreadcrumbList","@id":"https:\/\/erpm8.cloud\/2021\/portal-do-cliente\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/erpm8.cloud\/2021\/"},{"@type":"ListItem","position":2,"name":"portal-do-cliente"}]},{"@type":"WebSite","@id":"https:\/\/erpm8.cloud\/2021\/#website","url":"https:\/\/erpm8.cloud\/2021\/","name":"ERP M8.Cloud","description":"Completo Sistema de Gest\u00e3o ERP","publisher":{"@id":"https:\/\/erpm8.cloud\/2021\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/erpm8.cloud\/2021\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/erpm8.cloud\/2021\/#organization","name":"ERP M8 CLOUD","url":"https:\/\/erpm8.cloud\/2021\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/erpm8.cloud\/2021\/#\/schema\/logo\/image\/","url":"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2020\/12\/logo-6.png","contentUrl":"https:\/\/erpm8.cloud\/2021\/wp-content\/uploads\/2020\/12\/logo-6.png","width":125,"height":54,"caption":"ERP M8 CLOUD"},"image":{"@id":"https:\/\/erpm8.cloud\/2021\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/m8sistemas","https:\/\/instagram.com\/m8sistemas"]}]}},"_links":{"self":[{"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/pages\/9253","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/comments?post=9253"}],"version-history":[{"count":73,"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/pages\/9253\/revisions"}],"predecessor-version":[{"id":10182,"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/pages\/9253\/revisions\/10182"}],"wp:attachment":[{"href":"https:\/\/erpm8.cloud\/2021\/wp-json\/wp\/v2\/media?parent=9253"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}