{"id":3262,"date":"2026-07-21T14:08:37","date_gmt":"2026-07-21T12:08:37","guid":{"rendered":"https:\/\/rodrigofabi.com\/?page_id=3262"},"modified":"2026-07-21T14:08:37","modified_gmt":"2026-07-21T12:08:37","slug":"calculateur-cout-suivi-manuel","status":"publish","type":"page","link":"https:\/\/rodrigofabi.com\/fr\/calculateur-cout-suivi-manuel\/","title":{"rendered":"calculateur cout suivi manuel"},"content":{"rendered":"\n<!-- Bloc HTML personnalis\u00e9 WordPress -->\n<style>\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@400;600;700&family=Open+Sans:wght@400;600&display=swap');\n\n#calculateur-suivi-manuel {\n    width: 100%;\n}\n\n#calculateur-suivi-manuel,\n#calculateur-suivi-manuel *,\n#calculateur-suivi-manuel *::before,\n#calculateur-suivi-manuel *::after {\n    box-sizing: border-box;\n}\n\n#calculateur-suivi-manuel *,\n#calculateur-suivi-manuel *::before,\n#calculateur-suivi-manuel *::after {\n    border-width: 0;\n    border-style: solid;\n    border-color: #e5e7eb;\n}\n\n#calculateur-suivi-manuel h1,\n#calculateur-suivi-manuel h2,\n#calculateur-suivi-manuel h3,\n#calculateur-suivi-manuel h4,\n#calculateur-suivi-manuel p {\n    margin: 0;\n}\n\n#calculateur-suivi-manuel a {\n    color: inherit;\n    text-decoration: inherit;\n}\n\n#calculateur-suivi-manuel button,\n#calculateur-suivi-manuel input {\n    margin: 0;\n    padding: 0;\n    font: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n}\n\n#calculateur-suivi-manuel button {\n    appearance: button;\n    background-color: transparent;\n    background-image: none;\n    text-transform: none;\n}\n\n#calculateur-suivi-manuel svg {\n    display: block;\n    vertical-align: middle;\n}\n\n#calculateur-suivi-manuel .pointer-events-none{pointer-events:none}#calculateur-suivi-manuel .fixed{position:fixed}#calculateur-suivi-manuel .absolute{position:absolute}#calculateur-suivi-manuel .relative{position:relative}#calculateur-suivi-manuel .left-0{left:0}#calculateur-suivi-manuel .right-0{right:0}#calculateur-suivi-manuel .top-0{top:0}#calculateur-suivi-manuel .z-10{z-index:10}#calculateur-suivi-manuel .mb-0\\.5{margin-bottom:.125rem}#calculateur-suivi-manuel .mb-1{margin-bottom:.25rem}#calculateur-suivi-manuel .mb-10{margin-bottom:2.5rem}#calculateur-suivi-manuel .mb-2{margin-bottom:.5rem}#calculateur-suivi-manuel .mb-3{margin-bottom:.75rem}#calculateur-suivi-manuel .mb-4{margin-bottom:1rem}#calculateur-suivi-manuel .mb-6{margin-bottom:1.5rem}#calculateur-suivi-manuel .mb-8{margin-bottom:2rem}#calculateur-suivi-manuel .mt-1{margin-top:.25rem}#calculateur-suivi-manuel .mt-2{margin-top:.5rem}#calculateur-suivi-manuel .mt-8{margin-top:2rem}#calculateur-suivi-manuel .block{display:block}#calculateur-suivi-manuel .flex{display:flex}#calculateur-suivi-manuel .grid{display:grid}#calculateur-suivi-manuel .h-1\\.5{height:.375rem}#calculateur-suivi-manuel .h-32{height:8rem}#calculateur-suivi-manuel .h-4{height:1rem}#calculateur-suivi-manuel .h-8{height:2rem}#calculateur-suivi-manuel .h-full{height:100%}#calculateur-suivi-manuel .min-h-\\[600px\\]{min-height:600px}#calculateur-suivi-manuel .min-h-screen{min-height:100vh}#calculateur-suivi-manuel .w-1{width:.25rem}#calculateur-suivi-manuel .w-32{width:8rem}#calculateur-suivi-manuel .w-4{width:1rem}#calculateur-suivi-manuel .w-8{width:2rem}#calculateur-suivi-manuel .w-full{width:100%}#calculateur-suivi-manuel .max-w-2xl{max-width:42rem}#calculateur-suivi-manuel .max-w-6xl{max-width:72rem}#calculateur-suivi-manuel .flex-shrink-0{flex-shrink:0}#calculateur-suivi-manuel .transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#calculateur-suivi-manuel .grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}#calculateur-suivi-manuel .flex-col{flex-direction:column}#calculateur-suivi-manuel .items-end{align-items:flex-end}#calculateur-suivi-manuel .items-center{align-items:center}#calculateur-suivi-manuel .justify-center{justify-content:center}#calculateur-suivi-manuel .justify-between{justify-content:space-between}#calculateur-suivi-manuel .gap-2{gap:.5rem}#calculateur-suivi-manuel .gap-4{gap:1rem}#calculateur-suivi-manuel :is(.space-x-3>:not([hidden])~:not([hidden])){--tw-space-x-reverse:0;margin-right:calc(.75rem*var(--tw-space-x-reverse));margin-left:calc(.75rem*(1 - var(--tw-space-x-reverse)))}#calculateur-suivi-manuel :is(.space-y-3>:not([hidden])~:not([hidden])){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}#calculateur-suivi-manuel :is(.space-y-7>:not([hidden])~:not([hidden])){--tw-space-y-reverse:0;margin-top:calc(1.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.75rem*var(--tw-space-y-reverse))}#calculateur-suivi-manuel .overflow-hidden{overflow:hidden}#calculateur-suivi-manuel .rounded{border-radius:.25rem}#calculateur-suivi-manuel .rounded-2xl{border-radius:1rem}#calculateur-suivi-manuel .rounded-full{border-radius:9999px}#calculateur-suivi-manuel .rounded-lg{border-radius:.5rem}#calculateur-suivi-manuel .rounded-xl{border-radius:.75rem}#calculateur-suivi-manuel .rounded-bl-full{border-bottom-left-radius:9999px}#calculateur-suivi-manuel .border{border-width:1px}#calculateur-suivi-manuel .border-l-4{border-left-width:4px}#calculateur-suivi-manuel .border-t{border-top-width:1px}#calculateur-suivi-manuel .border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235\/var(--tw-border-opacity,1))}#calculateur-suivi-manuel .border-mustard{--tw-border-opacity:1;border-color:rgb(225 173 1\/var(--tw-border-opacity,1))}#calculateur-suivi-manuel .border-mustard\\\/30{border-color:rgba(225,173,1,.3)}#calculateur-suivi-manuel .border-white\\\/10{border-color:hsla(0,0%,100%,.1)}#calculateur-suivi-manuel .border-white\\\/20{border-color:hsla(0,0%,100%,.2)}#calculateur-suivi-manuel .bg-black\\\/30{background-color:rgba(0,0,0,.3)}#calculateur-suivi-manuel .bg-cream{--tw-bg-opacity:1;background-color:rgb(249 249 244\/var(--tw-bg-opacity,1))}#calculateur-suivi-manuel .bg-mustard{--tw-bg-opacity:1;background-color:rgb(225 173 1\/var(--tw-bg-opacity,1))}#calculateur-suivi-manuel .bg-mustard\\\/20{background-color:rgba(225,173,1,.2)}#calculateur-suivi-manuel .bg-petrol{--tw-bg-opacity:1;background-color:rgb(26 60 64\/var(--tw-bg-opacity,1))}#calculateur-suivi-manuel .bg-white\\\/10{background-color:hsla(0,0%,100%,.1)}#calculateur-suivi-manuel .bg-white\\\/5{background-color:hsla(0,0%,100%,.05)}#calculateur-suivi-manuel .p-4{padding:1rem}#calculateur-suivi-manuel .p-5{padding:1.25rem}#calculateur-suivi-manuel .p-6{padding:1.5rem}#calculateur-suivi-manuel .p-8{padding:2rem}#calculateur-suivi-manuel .px-4{padding-left:1rem;padding-right:1rem}#calculateur-suivi-manuel .py-2{padding-top:.5rem;padding-bottom:.5rem}#calculateur-suivi-manuel .pl-4{padding-left:1rem}#calculateur-suivi-manuel .pt-4{padding-top:1rem}#calculateur-suivi-manuel .pt-6{padding-top:1.5rem}#calculateur-suivi-manuel .text-center{text-align:center}#calculateur-suivi-manuel .font-heading{font-family:Montserrat,sans-serif}#calculateur-suivi-manuel .font-sans{font-family:Open Sans,sans-serif}#calculateur-suivi-manuel .text-2xl{font-size:1.5rem;line-height:2rem}#calculateur-suivi-manuel .text-3xl{font-size:1.875rem;line-height:2.25rem}#calculateur-suivi-manuel .text-4xl{font-size:2.25rem;line-height:2.5rem}#calculateur-suivi-manuel .text-\\[10px\\]{font-size:10px}#calculateur-suivi-manuel .text-\\[11px\\]{font-size:11px}#calculateur-suivi-manuel .text-\\[9px\\]{font-size:9px}#calculateur-suivi-manuel .text-lg{font-size:1.125rem;line-height:1.75rem}#calculateur-suivi-manuel .text-sm{font-size:.875rem;line-height:1.25rem}#calculateur-suivi-manuel .text-xl{font-size:1.25rem;line-height:1.75rem}#calculateur-suivi-manuel .text-xs{font-size:.75rem;line-height:1rem}#calculateur-suivi-manuel .font-bold{font-weight:700}#calculateur-suivi-manuel .font-normal{font-weight:400}#calculateur-suivi-manuel .font-semibold{font-weight:600}#calculateur-suivi-manuel .uppercase{text-transform:uppercase}#calculateur-suivi-manuel .italic{font-style:italic}#calculateur-suivi-manuel .leading-relaxed{line-height:1.625}#calculateur-suivi-manuel .leading-tight{line-height:1.25}#calculateur-suivi-manuel .tracking-tight{letter-spacing:-.025em}#calculateur-suivi-manuel .tracking-wide{letter-spacing:.025em}#calculateur-suivi-manuel .tracking-wider{letter-spacing:.05em}#calculateur-suivi-manuel .tracking-widest{letter-spacing:.1em}#calculateur-suivi-manuel .text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .text-mustard{--tw-text-opacity:1;color:rgb(225 173 1\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .text-mustard\\\/70{color:rgba(225,173,1,.7)}#calculateur-suivi-manuel .text-petrol{--tw-text-opacity:1;color:rgb(26 60 64\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .text-slate-800{--tw-text-opacity:1;color:rgb(30 41 59\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .text-white{--tw-text-opacity:1;color:rgb(255 255 255\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .opacity-10{opacity:.1}#calculateur-suivi-manuel .shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}#calculateur-suivi-manuel .shadow-2xl,#calculateur-suivi-manuel .shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}#calculateur-suivi-manuel .shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}#calculateur-suivi-manuel .transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#calculateur-suivi-manuel .transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#calculateur-suivi-manuel .hover\\:border-mustard\\\/60:hover{border-color:rgba(225,173,1,.6)}#calculateur-suivi-manuel .hover\\:bg-white\\\/20:hover{background-color:hsla(0,0%,100%,.2)}#calculateur-suivi-manuel .hover\\:text-mustard:hover{--tw-text-opacity:1;color:rgb(225 173 1\/var(--tw-text-opacity,1))}#calculateur-suivi-manuel .focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}@media (min-width:1024px){#calculateur-suivi-manuel .lg\\:w-5\\\/12{width:41.666667%}#calculateur-suivi-manuel .lg\\:w-7\\\/12{width:58.333333%}#calculateur-suivi-manuel .lg\\:flex-row{flex-direction:row}#calculateur-suivi-manuel .lg\\:p-12{padding:3rem}#calculateur-suivi-manuel .lg\\:text-left{text-align:left}#calculateur-suivi-manuel .lg\\:text-4xl{font-size:2.25rem;line-height:2.5rem}#calculateur-suivi-manuel .lg\\:text-5xl{font-size:3rem;line-height:1}}\n\n#calculateur-suivi-manuel input[type='range'] {\n    -webkit-appearance: none;\n    appearance: none;\n    background: transparent;\n}\n\n#calculateur-suivi-manuel input[type='range']::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    height: 20px;\n    width: 20px;\n    border-radius: 50%;\n    background: #E1AD01;\n    cursor: pointer;\n    margin-top: -8px;\n    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);\n    transition: transform 0.1s;\n}\n\n#calculateur-suivi-manuel input[type='range']::-webkit-slider-thumb:hover {\n    transform: scale(1.1);\n}\n\n#calculateur-suivi-manuel input[type='range']::-webkit-slider-runnable-track {\n    width: 100%;\n    height: 4px;\n    cursor: pointer;\n    background: #cbd5e1;\n    border-radius: 2px;\n}\n\n#calculateur-suivi-manuel input[type='range']::-moz-range-thumb {\n    height: 20px;\n    width: 20px;\n    border: none;\n    border-radius: 50%;\n    background: #E1AD01;\n    cursor: pointer;\n    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);\n}\n\n#calculateur-suivi-manuel input[type='range']::-moz-range-track {\n    width: 100%;\n    height: 4px;\n    cursor: pointer;\n    background: #cbd5e1;\n    border-radius: 2px;\n}\n\n<\/style>\n\n<div id=\"calculateur-suivi-manuel\">\n    <div class=\"min-h-screen flex items-center justify-center p-4 font-sans text-slate-800\">\n<!-- Main Container -->\n    <main class=\"w-full max-w-6xl bg-cream rounded-2xl shadow-2xl overflow-hidden flex flex-col lg:flex-row min-h-[600px]\">\n\n        <!-- LEFT PANEL: Inputs -->\n        <section class=\"w-full lg:w-7\/12 p-8 lg:p-12 flex flex-col justify-center\">\n\n            <!-- Header -->\n            <header class=\"mb-10\">\n                <h1 class=\"font-heading text-3xl lg:text-4xl font-bold text-petrol mb-3 leading-tight\">\n                    Impact \u00e9conomique du suivi manuel\n                <\/h1>\n                <h2 class=\"text-lg font-semibold text-gray-600 mb-4\">\n                    Demandes clients, devis, facturation et t\u00e2ches administratives r\u00e9currentes.\n                <\/h2>\n                <p class=\"text-sm text-gray-500 leading-relaxed max-w-2xl border-l-4 border-mustard pl-4\">\n                    Un simulateur simple pour estimer le temps pass\u00e9 chaque mois sur le suivi manuel et les petites t\u00e2ches administratives qui reviennent souvent.\n                <\/p>\n            <\/header>\n\n            <!-- Inputs Container -->\n            <div class=\"space-y-7\">\n\n                <!-- Input 1: Demandes entrantes -->\n                <div class=\"group\">\n                    <div class=\"flex justify-between items-end mb-2\">\n                        <label for=\"input-demandes\" class=\"font-heading font-semibold text-petrol text-sm tracking-wide\">\n                            DEMANDES ENTRANTES \u00c0 TRAITER (PAR SEMAINE)\n                        <\/label>\n                        <span id=\"display-demandes\" class=\"font-heading font-bold text-xl text-petrol\">2 h<\/span>\n                    <\/div>\n                    <input type=\"range\" id=\"input-demandes\" min=\"0\" max=\"15\" value=\"2\" step=\"0.5\" class=\"w-full focus:outline-none\">\n                    <p class=\"text-xs text-gray-400 mt-2 italic\">R\u00e9pondre aux mails de prospects, demander les informations manquantes, enregistrer les coordonn\u00e9es et noter les d\u00e9tails de la demande.<\/p>\n                <\/div>\n\n                <!-- Input 2: Devis -->\n                <div class=\"group\">\n                    <div class=\"flex justify-between items-end mb-2\">\n                        <label for=\"input-devis\" class=\"font-heading font-semibold text-petrol text-sm tracking-wide\">\n                            DEVIS \u00c0 PR\u00c9PARER OU \u00c0 SUIVRE (PAR SEMAINE)\n                        <\/label>\n                        <span id=\"display-devis\" class=\"font-heading font-bold text-xl text-petrol\">3 h<\/span>\n                    <\/div>\n                    <input type=\"range\" id=\"input-devis\" min=\"0\" max=\"20\" value=\"3\" step=\"0.5\" class=\"w-full focus:outline-none\">\n                    <p class=\"text-xs text-gray-400 mt-2 italic\">Pr\u00e9parer un devis, compl\u00e9ter les informations, relancer un client, v\u00e9rifier o\u00f9 en est une proposition.<\/p>\n                <\/div>\n\n                <!-- Input 3: Facturation -->\n                <div class=\"group\">\n                    <div class=\"flex justify-between items-end mb-2\">\n                        <label for=\"input-facturation\" class=\"font-heading font-semibold text-petrol text-sm tracking-wide\">\n                            CR\u00c9ATION DE FACTURES (PAR SEMAINE)\n                        <\/label>\n                        <span id=\"display-facturation\" class=\"font-heading font-bold text-xl text-petrol\">1 h<\/span>\n                    <\/div>\n                    <input type=\"range\" id=\"input-facturation\" min=\"0\" max=\"10\" value=\"1\" step=\"0.5\" class=\"w-full focus:outline-none\">\n                    <p class=\"text-xs text-gray-400 mt-2 italic\">Reprendre les donn\u00e9es d\u2019un devis accept\u00e9, transmettre les informations, v\u00e9rifier les \u00e9l\u00e9ments avant facture.<\/p>\n                <\/div>\n\n                <!-- Input 4: Administratif -->\n                <div class=\"group\">\n                    <div class=\"flex justify-between items-end mb-2\">\n                        <label for=\"input-admin\" class=\"font-heading font-semibold text-petrol text-sm tracking-wide\">\n                            T\u00c2CHES ADMINISTRATIVES R\u00c9P\u00c9TITIVES (PAR SEMAINE)\n                        <\/label>\n                        <span id=\"display-admin\" class=\"font-heading font-bold text-xl text-petrol\">3 h<\/span>\n                    <\/div>\n                    <input type=\"range\" id=\"input-admin\" min=\"0\" max=\"20\" value=\"3\" step=\"0.5\" class=\"w-full focus:outline-none\">\n                    <p class=\"text-xs text-gray-400 mt-2 italic\">Classement, tableaux \u00e0 mettre \u00e0 jour, recherches d\u2019informations, contr\u00f4les, emails internes, petites saisies.<\/p>\n                <\/div>\n\n                <!-- Input 5: Co\u00fbt horaire -->\n                <div class=\"group pt-4 border-t border-gray-200\">\n                    <div class=\"flex justify-between items-end mb-2\">\n                        <label for=\"input-cout\" class=\"font-heading font-semibold text-petrol text-sm tracking-wide\">\n                            CO\u00dbT HORAIRE INTERNE ESTIM\u00c9\n                        <\/label>\n                        <span id=\"display-cout\" class=\"font-heading font-bold text-xl text-petrol\">45 \u20ac<\/span>\n                    <\/div>\n                    <input type=\"range\" id=\"input-cout\" min=\"10\" max=\"300\" value=\"45\" step=\"5\" class=\"w-full focus:outline-none\">\n                    <p class=\"text-xs text-gray-400 mt-2 italic\">Une estimation suffit. L\u2019objectif est de donner un ordre de grandeur, pas un calcul comptable exact.<\/p>\n                <\/div>\n\n            <\/div>\n        <\/section>\n\n        <!-- RIGHT PANEL: Results -->\n        <section class=\"w-full lg:w-5\/12 bg-petrol text-white p-8 lg:p-12 flex flex-col justify-between relative\">\n            <!-- Decorative circle -->\n            <div class=\"absolute top-0 right-0 w-32 h-32 bg-mustard opacity-10 rounded-bl-full pointer-events-none\"><\/div>\n\n            <div class=\"z-10 relative\">\n                <h3 class=\"font-heading text-mustard font-bold text-sm tracking-widest uppercase mb-8\">\n                    Impact estim\u00e9\n                <\/h3>\n\n                <!-- HERO RESULT: Temps mensuel -->\n                <div class=\"bg-petrol border border-mustard\/30 rounded-xl p-6 shadow-lg mb-6 relative overflow-hidden group hover:border-mustard\/60 transition-colors\">\n                    <div class=\"absolute top-0 left-0 w-1 h-full bg-mustard\"><\/div>\n                    <h4 class=\"text-gray-300 text-sm font-semibold mb-2\">Temps manuel estim\u00e9<\/h4>\n                    <div class=\"text-4xl lg:text-5xl font-heading font-bold text-white mb-2 tracking-tight\">\n                        <span id=\"result-temps-total\">0<\/span>\n                        <span class=\"text-2xl text-gray-400 font-normal\">h \/ mois<\/span>\n                    <\/div>\n                    <p class=\"text-sm text-mustard font-semibold\" id=\"result-jours\">Soit environ 0 journ\u00e9es de travail par mois.<\/p>\n                <\/div>\n\n                <!-- Secondary Cards Grid -->\n                <div class=\"grid grid-cols-1 gap-4\">\n\n                    <!-- Card A: Cost -->\n                    <div class=\"bg-white\/5 rounded-lg p-5 border border-white\/10\">\n                        <div class=\"flex flex-col\">\n                            <span class=\"text-gray-400 text-xs font-bold uppercase tracking-wide mb-1\">Co\u00fbt op\u00e9rationnel estim\u00e9<\/span>\n                            <span id=\"result-cout-total-mensuel\" class=\"font-heading text-3xl font-bold text-white\">0 \u20ac <span class=\"text-sm text-gray-400 font-normal\">\/ mois<\/span><\/span>\n                            <span id=\"result-cout-total-annuel\" class=\"font-heading text-xl font-semibold text-mustard mt-1\">0 \u20ac <span class=\"text-xs text-mustard\/70 font-normal\">\/ an<\/span><\/span>\n                            <p class=\"text-[10px] text-gray-500 mt-2\">Bas\u00e9 sur le temps indiqu\u00e9 et le co\u00fbt horaire estim\u00e9.<\/p>\n                        <\/div>\n                    <\/div>\n\n                    <!-- Card B: Breakdown -->\n                    <div class=\"bg-white\/5 rounded-lg p-5 border border-white\/10\">\n                        <span class=\"text-gray-400 text-xs font-bold uppercase tracking-wide mb-3 block\">R\u00e9partition du temps (mensuel)<\/span>\n                        \n                        <div class=\"space-y-3\">\n                            <!-- Demandes Bar -->\n                            <div>\n                                <div class=\"flex justify-between text-xs text-gray-300 mb-1\">\n                                    <span>Demandes entrantes<\/span><span id=\"label-demandes-mensuel\" class=\"font-semibold text-white\">0 h<\/span>\n                                <\/div>\n                                <div class=\"w-full bg-black\/30 rounded-full h-1.5\">\n                                    <div id=\"bar-demandes\" class=\"bg-mustard h-1.5 rounded-full bar-transition\" style=\"width: 0%\"><\/div>\n                                <\/div>\n                            <\/div>\n                            <!-- Devis Bar -->\n                            <div>\n                                <div class=\"flex justify-between text-xs text-gray-300 mb-1\">\n                                    <span>Devis<\/span><span id=\"label-devis-mensuel\" class=\"font-semibold text-white\">0 h<\/span>\n                                <\/div>\n                                <div class=\"w-full bg-black\/30 rounded-full h-1.5\">\n                                    <div id=\"bar-devis\" class=\"bg-mustard h-1.5 rounded-full bar-transition\" style=\"width: 0%\"><\/div>\n                                <\/div>\n                            <\/div>\n                            <!-- Facturation Bar -->\n                            <div>\n                                <div class=\"flex justify-between text-xs text-gray-300 mb-1\">\n                                    <span>Cr\u00e9ation de factures<\/span><span id=\"label-facturation-mensuel\" class=\"font-semibold text-white\">0 h<\/span>\n                                <\/div>\n                                <div class=\"w-full bg-black\/30 rounded-full h-1.5\">\n                                    <div id=\"bar-facturation\" class=\"bg-mustard h-1.5 rounded-full bar-transition\" style=\"width: 0%\"><\/div>\n                                <\/div>\n                            <\/div>\n                            <!-- Admin Bar -->\n                            <div>\n                                <div class=\"flex justify-between text-xs text-gray-300 mb-1\">\n                                    <span>Administratif<\/span><span id=\"label-admin-mensuel\" class=\"font-semibold text-white\">0 h<\/span>\n                                <\/div>\n                                <div class=\"w-full bg-black\/30 rounded-full h-1.5\">\n                                    <div id=\"bar-admin\" class=\"bg-mustard h-1.5 rounded-full bar-transition\" style=\"width: 0%\"><\/div>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <!-- Card C: Worst Offender -->\n                    <div class=\"bg-white\/5 rounded-lg p-5 border border-white\/10 flex items-center space-x-3\">\n                        <div class=\"flex-shrink-0 w-8 h-8 rounded-full bg-mustard\/20 flex items-center justify-center text-mustard\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\">\n                              <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z\" \/>\n                            <\/svg>\n                        <\/div>\n                        <div>\n                            <span class=\"text-gray-400 text-[10px] font-bold uppercase tracking-wide block mb-0.5\">Poste le plus chronophage<\/span>\n                            <span id=\"result-pire-poste\" class=\"font-heading text-sm font-bold text-white block\">Aucun<\/span>\n                            <p class=\"text-[9px] text-gray-500 mt-1 leading-tight\">C\u2019est la cat\u00e9gorie qui semble consommer le plus de temps chaque mois.<\/p>\n                        <\/div>\n                    <\/div>\n\n                <\/div>\n            <\/div>\n\n            <!-- Footer \/ Disclaimer & Action -->\n            <div class=\"mt-8 pt-6 border-t border-white\/10 flex flex-col gap-4\">\n                <p class=\"text-[11px] text-gray-400 leading-relaxed text-center lg:text-left\">\n                    Ce calcul est indicatif. Il permet de mettre des chiffres sur des t\u00e2ches souvent invisibles dans le quotidien.\n                <\/p>\n                \n                <div class=\"flex flex-col lg:flex-row justify-between items-center gap-4 mt-2\">\n                    <button id=\"btn-copy\" class=\"text-xs bg-white\/10 hover:bg-white\/20 text-white py-2 px-4 rounded transition-colors flex items-center gap-2 border border-white\/20\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" \/>\n                        <\/svg>\n                        <span id=\"btn-copy-text\">Copier le r\u00e9sum\u00e9<\/span>\n                    <\/button>\n\n                    <a href=\"https:\/\/rodrigofabi.com\/fr\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-[10px] text-gray-500 font-semibold uppercase tracking-wider hover:text-mustard transition-colors text-center\">\n                        Outil pr\u00e9par\u00e9 par Rodrigo Fabi\n                    <\/a>\n                <\/div>\n            <\/div>\n        <\/section>\n    <\/main>\n\n    <!-- Logic -->\n    <script>\n        (() => {\n            const calculator = document.querySelector('#calculateur-suivi-manuel');\n            if (!calculator) return;\n            \/\/ Constants\n            const WEEKS_IN_MONTH = 4;\n            const HOURS_IN_DAY = 7;\n\n            \/\/ DOM Elements - Inputs\n            const inputDemandes = calculator.querySelector('#input-demandes');\n            const inputDevis = calculator.querySelector('#input-devis');\n            const inputFacturation = calculator.querySelector('#input-facturation');\n            const inputAdmin = calculator.querySelector('#input-admin');\n            const inputCout = calculator.querySelector('#input-cout');\n\n            \/\/ DOM Elements - Displays\n            const displayDemandes = calculator.querySelector('#display-demandes');\n            const displayDevis = calculator.querySelector('#display-devis');\n            const displayFacturation = calculator.querySelector('#display-facturation');\n            const displayAdmin = calculator.querySelector('#display-admin');\n            const displayCout = calculator.querySelector('#display-cout');\n\n            \/\/ DOM Elements - Results\n            const resultTempsTotal = calculator.querySelector('#result-temps-total');\n            const resultJours = calculator.querySelector('#result-jours');\n            const resultCoutTotalMensuel = calculator.querySelector('#result-cout-total-mensuel');\n            const resultCoutTotalAnnuel = calculator.querySelector('#result-cout-total-annuel');\n            const resultPirePoste = calculator.querySelector('#result-pire-poste');\n            \n            \/\/ DOM Elements - Breakdown\n            const labelDemandes = calculator.querySelector('#label-demandes-mensuel');\n            const labelDevis = calculator.querySelector('#label-devis-mensuel');\n            const labelFacturation = calculator.querySelector('#label-facturation-mensuel');\n            const labelAdmin = calculator.querySelector('#label-admin-mensuel');\n            const barDemandes = calculator.querySelector('#bar-demandes');\n            const barDevis = calculator.querySelector('#bar-devis');\n            const barFacturation = calculator.querySelector('#bar-facturation');\n            const barAdmin = calculator.querySelector('#bar-admin');\n\n            const btnCopy = calculator.querySelector('#btn-copy');\n            const btnCopyText = calculator.querySelector('#btn-copy-text');\n\n            \/\/ Formatters\n            const eurFormat = new Intl.NumberFormat('fr-FR', {\n                style: 'currency',\n                currency: 'EUR',\n                maximumFractionDigits: 0\n            });\n\n            \/\/ Format hours safely (no decimals if integer)\n            const formatHours = (num) => {\n                return Number.isInteger(num) ? num : num.toFixed(1).replace('.', ',');\n            };\n\n            \/\/ Globals for copy function\n            let currentStats = {};\n\n            \/\/ Calculation Logic\n            function calculate() {\n                \/\/ Get weekly values\n                const vDemandes = parseFloat(inputDemandes.value) || 0;\n                const vDevis = parseFloat(inputDevis.value) || 0;\n                const vFacturation = parseFloat(inputFacturation.value) || 0;\n                const vAdmin = parseFloat(inputAdmin.value) || 0;\n                const vCoutHoraire = parseFloat(inputCout.value) || 0;\n\n                \/\/ Update Input Displays\n                displayDemandes.innerText = `${formatHours(vDemandes)} h`;\n                displayDevis.innerText = `${formatHours(vDevis)} h`;\n                displayFacturation.innerText = `${formatHours(vFacturation)} h`;\n                displayAdmin.innerText = `${formatHours(vAdmin)} h`;\n                displayCout.innerText = eurFormat.format(vCoutHoraire);\n\n                \/\/ Calculate Monthly Values\n                const mDemandes = vDemandes * WEEKS_IN_MONTH;\n                const mDevis = vDevis * WEEKS_IN_MONTH;\n                const mFacturation = vFacturation * WEEKS_IN_MONTH;\n                const mAdmin = vAdmin * WEEKS_IN_MONTH;\n\n                const tempsTotalMensuel = mDemandes + mDevis + mFacturation + mAdmin;\n                const coutMensuel = tempsTotalMensuel * vCoutHoraire;\n                const coutAnnuel = coutMensuel * 12; \/\/ Calcul du co\u00fbt annuel\n                const joursEquivalent = tempsTotalMensuel \/ HOURS_IN_DAY;\n\n                \/\/ Determine worst offender\n                const categories = [\n                    { name: \"Demandes entrantes\", val: mDemandes },\n                    { name: \"Devis\", val: mDevis },\n                    { name: \"Cr\u00e9ation de factures\", val: mFacturation },\n                    { name: \"Administratif\", val: mAdmin }\n                ];\n                \n                let maxCat = { name: \"Aucun\", val: 0 };\n                if (tempsTotalMensuel > 0) {\n                    maxCat = categories.reduce((prev, current) => (prev.val > current.val) ? prev : current);\n                }\n\n                \/\/ Update Results Texts\n                resultTempsTotal.innerText = formatHours(tempsTotalMensuel);\n                resultJours.innerText = `Soit environ ${formatHours(joursEquivalent)} journ\u00e9es de travail par mois.`;\n                \n                \/\/ Update Cost Displays\n                resultCoutTotalMensuel.innerHTML = `${eurFormat.format(coutMensuel)} <span class=\"text-sm text-gray-400 font-normal\">\/ mois<\/span>`;\n                resultCoutTotalAnnuel.innerHTML = `${eurFormat.format(coutAnnuel)} <span class=\"text-xs text-mustard\/70 font-normal\">\/ an<\/span>`;\n                \n                resultPirePoste.innerText = maxCat.val > 0 ? maxCat.name : \"Aucun\";\n\n                \/\/ Update Breakdown Labels\n                labelDemandes.innerText = `${formatHours(mDemandes)} h`;\n                labelDevis.innerText = `${formatHours(mDevis)} h`;\n                labelFacturation.innerText = `${formatHours(mFacturation)} h`;\n                labelAdmin.innerText = `${formatHours(mAdmin)} h`;\n\n                \/\/ Update Progress Bars (Width based on percentage of total)\n                const getPct = (val) => tempsTotalMensuel > 0 ? (val \/ tempsTotalMensuel) * 100 : 0;\n                \n                barDemandes.style.width = `${getPct(mDemandes)}%`;\n                barDevis.style.width = `${getPct(mDevis)}%`;\n                barFacturation.style.width = `${getPct(mFacturation)}%`;\n                barAdmin.style.width = `${getPct(mAdmin)}%`;\n\n                \/\/ Save stats for copy\n                currentStats = {\n                    tempsTotalMensuel: formatHours(tempsTotalMensuel),\n                    joursEquivalent: formatHours(joursEquivalent),\n                    coutMensuel: eurFormat.format(coutMensuel),\n                    coutAnnuel: eurFormat.format(coutAnnuel),\n                    pirePoste: maxCat.val > 0 ? maxCat.name : \"Aucun\",\n                    breakdown: {\n                        demandes: formatHours(mDemandes),\n                        devis: formatHours(mDevis),\n                        facturation: formatHours(mFacturation),\n                        admin: formatHours(mAdmin)\n                    }\n                };\n            }\n\n            \/\/ Copy to clipboard functionality using fallback for maximum compatibility\n            function copySummary() {\n                const textToCopy = `\ud83d\udccc Impact estim\u00e9 du suivi manuel :\n- Temps manuel estim\u00e9 : ${currentStats.tempsTotalMensuel} h \/ mois (soit environ ${currentStats.joursEquivalent} journ\u00e9es de travail)\n- Co\u00fbt op\u00e9rationnel estim\u00e9 : ${currentStats.coutMensuel} \/ mois (soit ${currentStats.coutAnnuel} \/ an)\n- Poste le plus chronophage : ${currentStats.pirePoste}\n\nR\u00e9partition :\n- Demandes entrantes : ${currentStats.breakdown.demandes} h\n- Devis : ${currentStats.breakdown.devis} h\n- Cr\u00e9ation de factures : ${currentStats.breakdown.facturation} h\n- Administratif : ${currentStats.breakdown.admin} h`;\n\n                \/\/ Create temporary textarea\n                const textArea = document.createElement(\"textarea\");\n                textArea.value = textToCopy;\n                \n                \/\/ Avoid scrolling to bottom\n                textArea.style.top = \"0\";\n                textArea.style.left = \"0\";\n                textArea.style.position = \"fixed\";\n\n                document.body.appendChild(textArea);\n                textArea.focus();\n                textArea.select();\n\n                try {\n                    const successful = document.execCommand('copy');\n                    if (successful) {\n                        btnCopyText.innerText = \"Copi\u00e9 !\";\n                        setTimeout(() => {\n                            btnCopyText.innerText = \"Copier le r\u00e9sum\u00e9\";\n                        }, 2000);\n                    }\n                } catch (err) {\n                    console.error('Oops, unable to copy', err);\n                }\n\n                document.body.removeChild(textArea);\n            }\n\n            \/\/ Event Listeners\n            const inputs = [inputDemandes, inputDevis, inputFacturation, inputAdmin, inputCout];\n            inputs.forEach(input => {\n                input.addEventListener('input', calculate);\n            });\n\n            btnCopy.addEventListener('click', copySummary);\n\n            \/\/ Initial Calculate\n            calculate();\n        })();\n    <\/script>\n    <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Impact \u00e9conomique du suivi manuel Demandes clients, devis, facturation et t\u00e2ches administratives r\u00e9currentes. Un simulateur simple pour estimer le temps pass\u00e9 chaque mois sur le suivi manuel et les petites t\u00e2ches administratives qui reviennent souvent. DEMANDES ENTRANTES \u00c0 TRAITER (PAR SEMAINE) 2 h R\u00e9pondre aux mails de prospects, demander les informations manquantes, enregistrer les coordonn\u00e9es [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"disabled","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"disabled","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-3262","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Rodrigo Fabi","author_link":"https:\/\/rodrigofabi.com\/fr\/author\/rodrigo\/"},"uagb_comment_info":0,"uagb_excerpt":"Impact \u00e9conomique du suivi manuel Demandes clients, devis, facturation et t\u00e2ches administratives r\u00e9currentes. Un simulateur simple pour estimer le temps pass\u00e9 chaque mois sur le suivi manuel et les petites t\u00e2ches administratives qui reviennent souvent. DEMANDES ENTRANTES \u00c0 TRAITER (PAR SEMAINE) 2 h R\u00e9pondre aux mails de prospects, demander les informations manquantes, enregistrer les coordonn\u00e9es\u2026","_links":{"self":[{"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/pages\/3262","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/comments?post=3262"}],"version-history":[{"count":2,"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/pages\/3262\/revisions"}],"predecessor-version":[{"id":3265,"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/pages\/3262\/revisions\/3265"}],"wp:attachment":[{"href":"https:\/\/rodrigofabi.com\/fr\/wp-json\/wp\/v2\/media?parent=3262"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}