{"id":766,"date":"2025-08-12T18:49:49","date_gmt":"2025-08-12T18:49:49","guid":{"rendered":"https:\/\/themediabees.pt\/?page_id=766"},"modified":"2025-11-25T15:24:30","modified_gmt":"2025-11-25T15:24:30","slug":"calculadora","status":"publish","type":"page","link":"https:\/\/themediabees.pt\/es\/calculadora\/","title":{"rendered":"Calculadora"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n\n\n\n \n\n \n\n Calculadora BeeStrategy\u2122<\/title>\n\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@400;600;700&display=swap\" rel=\"stylesheet\">\n\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600;700&family=Poppins:wght@600;700&display=swap\" rel=\"stylesheet\">\n\n <style>\n\n :root {\n\n --yellow: #FFD100; \/* amarelo gema *\/\n\n --orange: #FFC766; \/* laranja suave *\/\n\n --black: #111111;\n\n --white: #ffffff;\n\n --gray: #f6f7f8;\n\n --dark-gray: #53565a;\n\n --light-yellow: #FFF7CC;\n\n --ring: #11111122;\n\n --error: #D64545;\n\n --shadow: 0 10px 30px rgba(0,0,0,0.08);\n\n --radius: 16px;\n\n --radius-lg: 22px;\n\n --bezier: cubic-bezier(.2,.8,.2,1);\n\n }\n\n \n\n * { box-sizing: border-box; }\n\n html, body { height: 100%; }\n\n body {\n\n margin: 0;\n\n font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, \"Helvetica Neue\", Arial, sans-serif;\n\n background:\n\n radial-gradient(1200px 800px at 10% -10%, #fff7cc44, transparent 60%),\n\n radial-gradient(900px 600px at 110% 20%, #ffe38a33, transparent 60%),\n\n var(--white);\n\n color: var(--black);\n\n line-height: 1.6;\n\n }\n\n \n\n .container { max-width: 1100px; margin: 0 auto; padding: 28px; }\n\n \n\n header { display: grid; gap: 6px; text-align: center; margin-bottom: 14px; }\n\n .brand-badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: var(--light-yellow); color: var(--black); font-weight: 600; width: fit-content; margin: 0 auto 6px; box-shadow: var(--shadow); }\n\n .brand-badge svg { width: 18px; height: 18px; }\n\n .brand-badge .bee-emoji{font-size:18px;line-height:1}\n\n h1 { font-family: 'Poppins', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, \"Helvetica Neue\", Arial, sans-serif; font-size: 2.2rem; font-weight: 700; margin: 0; letter-spacing: -0.02em; }\n\n .subtitle { font-size: 1.05rem; color: var(--dark-gray); margin: 0; }\n\n \n\n .layout { display: grid; grid-template-columns: 2fr 1fr; gap: 22px; align-items: start; }\n\n \n\n .card { background: var(--white); border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden; }\n\n \n\n \/* Novo: badge para n\u00fameros das etapas (evita emoji keycap) *\/\n\n .k { display:inline-grid; place-items:center; width:28px; height:28px; border-radius:8px; background: var(--yellow); color: var(--black); font-weight: 800; margin-right: 8px; box-shadow: inset 0 1px 0 #ffffffaa, 0 1px 0 #00000008; border: 1px solid #00000010; vertical-align: middle; }\n\n \n\n \/* Stepper *\/\n\n .stepper { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; padding: 14px; background: var(--gray); border-bottom: 1px solid #e9eaec; }\n\n .step-dot { display: flex; align-items: center; gap: 10px; }\n\n .dot { width: 28px; height: 28px; border-radius: 999px; background: #e9eaec; color: #7a7d82; font-weight: 700; display: grid; place-items: center; border: 2px solid transparent; }\n\n .step-dot.active .dot { background: var(--yellow); color: var(--black); border-color: #00000020; }\n\n .step-dot.done .dot { background: var(--black); color: var(--white); }\n\n .step-dot span { font-size: .9rem; color: var(--dark-gray); }\n\n \n\n \/* Progress *\/\n\n .progress-bar { height: 6px; background: #e9eaec; border-radius: 999px; margin: 0 14px 12px; overflow: hidden; }\n\n .progress { height: 100%; width: 0; background: linear-gradient(90deg, var(--yellow), #ffe38a); transition: width .35s var(--bezier); }\n\n \n\n \/* Steps *\/\n\n .step, .result { display: none; padding: 22px; }\n\n .step.active, .result.active { display: block; animation: slideIn .35s var(--bezier); }\n\n .step-title { font-family: 'Poppins', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, \"Helvetica Neue\", Arial, sans-serif; font-size: 1.25rem; font-weight: 700; margin: 0 0 4px; }\n\n .step-description { margin: 0 0 18px; color: var(--dark-gray); }\n\n \n\n .options { display: grid; gap: 12px; }\n\n .option { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 14px; border: 2px solid #eceff1; background: var(--white); border-radius: var(--radius); padding: 14px 16px; cursor: pointer; transition: transform .15s var(--bezier), border-color .15s var(--bezier), background-color .15s var(--bezier), box-shadow .15s var(--bezier); user-select: none; }\n\n .option:hover { transform: translateY(-2px); border-color: var(--yellow); box-shadow: 0 8px 20px #00000010; }\n\n .option.selected { border-color: var(--yellow); background: var(--light-yellow); box-shadow: 0 12px 28px #00000014; }\n\n .option:focus-visible { outline: 4px solid var(--ring); }\n\n .option-icon { display: none !important; }\n\n .option-icon svg { width: 26px; height: 26px; }\n\n \n\n .check { width: 24px; height: 24px; border: 2px solid #c9ccd1; border-radius: 8px; display: grid; place-items: center; font-weight: 800; color: transparent; transition: all .15s var(--bezier); }\n\n .option.selected .check { background: var(--black); border-color: var(--black); color: var(--white); transform: scale(1.05); }\n\n .radio { border-radius: 999px; }\n\n \n\n .nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 18px; position: sticky; bottom: 0; background: linear-gradient(180deg, #ffffff00, #ffffffcc 40%, #ffffff); padding-top: 8px; }\n\n \n\n .btn { appearance: none; border: 0; cursor: pointer; border-radius: 999px; padding: 12px 22px; font-weight: 700; transition: transform .15s var(--bezier), box-shadow .15s var(--bezier); box-shadow: 0 4px 10px #0000000f; display: inline-flex; align-items: center; justify-content: center; text-align: center; }\n\n .btn:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(255,209,0,.3); }\n\n .btn:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }\n\n .btn-primary { background: var(--yellow); color: var(--black); }\n\n .btn-primary::after { content: \"\u2192\"; display: inline-block; margin-left: 8px; transition: transform .15s var(--bezier); }\n\n .btn-primary:hover::after { transform: translateX(3px); }\n\n .btn-back { background: var(--gray); color: var(--black); }\n\n .btn-cta { background: var(--black); color: var(--white); width: 100%; max-width: 460px; margin: 0 auto; display: flex; align-items: center; justify-content: center; padding: 14px 22px; text-align: center; }\n\n .btn-cta::after { content: \"\u2192\"; display: inline-block; margin-left: 8px; transition: transform .15s var(--bezier); }\n\n .btn-cta:hover::after { transform: translateX(3px); }\n\n .btn-secondary { background: var(--white); color: var(--black); border: 2px solid var(--yellow); width: 100%; max-width: 460px; margin: 12px auto 0; display: flex; align-items: center; justify-content: center; text-align: center; }\n\n .btn-restart { background: transparent; color: var(--dark-gray); text-decoration: underline; padding: 8px 0; }\n\n \n\n \/* Esconder bot\u00e3o Continuar em passos de escolha \u00fanica (auto-advance) *\/\n\n .step[data-autoadvance=\"true\"] .nav .btn-primary { display: none; }\n\n \/* Bot\u00e3o de resultados do passo 5 aparece apenas ap\u00f3s sele\u00e7\u00e3o *\/\n\n #btn-result { display: none; }\n\n \n\n .cta-note { text-align: center; font-size: .92rem; color: #6f7478; margin: 8px 0 0; }\n\n .hint { color: var(--dark-gray); font-size: .95rem; }\n\n .error { color: var(--error); font-weight: 600; margin-top: 8px; display: none; }\n\n .error.show { display: block; }\n\n \n\n \/* Chips (sele\u00e7\u00f5es do passo 2) *\/\n\n .chips { display: none; flex-wrap: wrap; gap: 8px; margin: 10px 2px 0; }\n\n .chip { border: 1px solid var(--yellow); background: var(--light-yellow); padding: 6px 10px; border-radius: 999px; font-weight: 700; font-size: .92rem; cursor: pointer; }\n\n .chip span { padding-left: 8px; }\n\n \n\n \/* Result *\/\n\n .result-head { text-align: center; padding: 20px 16px; margin: 0 6px 10px; background: radial-gradient(600px 180px at 50% -40px, #fff4b8, transparent 70%); border-radius: 16px; }\n\n .result-icon { font-size: 44px; margin-bottom: 6px; }\n\n .result-title { font-family: 'Poppins', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, \"Helvetica Neue\", Arial, sans-serif; font-size: 1.9rem; font-weight: 800; margin: 0 0 6px; letter-spacing: -0.02em; }\n\n .result-price { display: inline-block; background: var(--light-yellow); border-radius: 999px; padding: 8px 14px; font-weight: 800; margin: 10px 0 18px; }\n\n .result-description { max-width: 620px; margin: 0 auto 18px; }\n\n .result-includes { background: var(--gray); border-radius: 14px; padding: 16px; margin: 0 auto 16px; }\n\n .result-includes-title { font-weight: 700; margin-bottom: 8px; }\n\n .result-includes ul { list-style: none; padding: 0; margin: 0; }\n\n .result-includes li { display: flex; align-items: center; gap: 8px; margin: 8px 0; }\n\n .result-includes li::before { content: \"\u2713\"; color: var(--yellow); font-weight: 800; }\n\n .result-tip { font-style: italic; color: var(--dark-gray); margin: 16px 0 22px; text-align: center; }\n\n \n\n \/* Summary aside *\/\n\n .aside { position: sticky; top: 18px; }\n\n .summary { padding: 18px; }\n\n .summary h3 { margin: 0 0 6px; font-size: 1.05rem; }\n\n .summary dl { margin: 0; }\n\n .summary dt { font-weight: 700; margin-top: 10px; font-size: .88rem; color: #6f7478; }\n\n .summary dd { margin: 4px 0 0 0; font-size: .98rem; }\n\n .summary-empty { color: #6f7478; font-style: italic; }\n\n \n\n \/* Accordions *\/\n\n .service-details { margin-top: 18px; }\n\n .service-accordion { border: 1px solid #eceff1; border-radius: 12px; overflow: hidden; margin-bottom: 12px; }\n\n .service-header { background: var(--light-yellow); padding: 14px 16px; font-weight: 700; display: flex; align-items: center; justify-content: space-between; cursor: pointer; }\n\n .service-header:hover { background: var(--yellow); }\n\n .service-content { max-height: 0; overflow: hidden; transition: max-height .3s var(--bezier), padding .3s var(--bezier); background: var(--white); }\n\n .service-content.active { max-height: 1000px; padding: 12px 16px; }\n\n .service-content ul { list-style: none; margin: 0; padding: 0 0 0 4px; }\n\n .service-content li { position: relative; padding-left: 18px; margin: 8px 0; }\n\n .service-content li::before { content: \"\u2022\"; color: var(--yellow); position: absolute; left: 0; }\n\n .service-tagline { font-style: italic; color: var(--dark-gray); margin-top: 8px; padding-left: 18px; }\n\n \n\n .step-dot{cursor:pointer}\n\n .step-dot:hover .dot{ box-shadow: 0 0 0 4px #00000010; }\n\n .result-icon svg{ width:52px; height:52px; stroke:#111; fill:none; }\n\n .icon{ display:inline-flex; align-items:center; gap:8px; }\n\n .icon svg{ width:18px; height:18px; stroke:#111; fill:none; stroke-width:1.75; }\n\n .badge-popular{ display:inline-block; background: var(--yellow); color: var(--black); padding: 6px 10px; border-radius: 999px; font-weight: 800; margin-bottom: 8px; box-shadow: var(--shadow); }\n\n .result-footnote{ font-size:.9rem; color:#6f7478; text-align:center; margin:8px 0; }\n\n @keyframes pop{ 0%{ transform: scale(0.82);} 100%{ transform: scale(1);} }\n\n .option.selected .check{ animation: pop .18s var(--bezier); }\n\n \n\n @keyframes slideIn { from { opacity: .4; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }\n\n \n\n \/* Acessibilidade: reduzir movimento *\/\n\n @media (prefers-reduced-motion: reduce) {\n\n * { animation: none !important; transition: none !important; }\n\n }\n\n \n\n \/* Print (para guardar em PDF) *\/\n\n @media print {\n\n header, .layout .aside, .nav, .stepper, .progress-bar, .btn-restart { display: none !important; }\n\n .container { max-width: 900px; }\n\n .result.active { display: block !important; }\n\n body { background: #fff; }\n\n }\n\n \n\n @media (max-width: 900px) {\n\n .layout { grid-template-columns: 1fr; }\n\n .aside { position: static; }\n\n .stepper { grid-template-columns: repeat(5, minmax(0,1fr)); }\n\n }\n\n \/* Mobile stepper: scrollable & alinhado *\/\n\n @media (max-width: 640px) {\n\n .container { padding: 18px 16px; }\n\n .stepper { display: flex; gap: 10px; padding: 10px 12px; background: var(--gray); border-bottom: 1px solid #e9eaec; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none; }\n\n .stepper::-webkit-scrollbar { display: none; }\n\n .step-dot { flex: 0 0 auto; display: grid; grid-template-columns: 1fr; justify-items: center; align-content: center; padding: 8px 10px; background: #fff; border-radius: 12px; border: 1px solid #e9eaec; }\n\n .step-dot .dot { margin-bottom: 4px; }\n\n .step-dot span { font-size: .78rem; color: var(--dark-gray); white-space: nowrap; }\n\n .progress-bar { margin: 0 12px 10px; }\n\n }\n\n <\/style>\n\n<\/head>\n\n<body>\n\n <div class=\"container\">\n\n <header>\n\n <div class=\"brand-badge\" aria-label=\"The Media Bees\"><span class=\"bee-emoji\" aria-hidden=\"true\">\ud83d\udc1d<\/span> BeeStrategy\u2122<\/div>\n\n <h1>Calculadora BeeStrategy\u2122<\/h1>\n\n <p class=\"subtitle\">Descobre o pacote ideal para onde est\u00e1s e para onde queres ir.<\/p>\n\n <\/header>\n\n \n\n <div class=\"layout\">\n\n <main class=\"card\" role=\"region\" aria-label=\"Calculadora BeeStrategy\">\n\n <!-- Stepper -->\n\n <div class=\"stepper\" aria-hidden=\"true\">\n\n <div class=\"step-dot\" id=\"s-dot-1\"><div class=\"dot\">1<\/div><span>Fase<\/span><\/div>\n\n <div class=\"step-dot\" id=\"s-dot-2\"><div class=\"dot\">2<\/div><span>Necessidades<\/span><\/div>\n\n <div class=\"step-dot\" id=\"s-dot-3\"><div class=\"dot\">3<\/div><span>Website<\/span><\/div>\n\n <div class=\"step-dot\" id=\"s-dot-4\"><div class=\"dot\">4<\/div><span>Acompanhamento<\/span><\/div>\n\n <div class=\"step-dot\" id=\"s-dot-5\"><div class=\"dot\">5<\/div><span>Forma\u00e7\u00e3o<\/span><\/div>\n\n <\/div>\n\n <div class=\"progress-bar\" aria-hidden=\"true\"><div class=\"progress\" id=\"progress\"><\/div><\/div>\n\n \n\n <!-- Step 1 (auto-advance) -->\n\n <section class=\"step active\" id=\"step1\" data-autoadvance=\"true\" aria-labelledby=\"step1-title\">\n\n <h2 id=\"step1-title\" class=\"step-title\"><span class=\"k\" aria-hidden=\"true\">1<\/span> Em que fase est\u00e1 a tua marca?<\/h2>\n\n <p class=\"step-description hint\">Escolhe uma op\u00e7\u00e3o.<\/p>\n\n <div class=\"options\" id=\"options1\" role=\"radiogroup\" aria-label=\"Fase da marca\">\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"A iniciar\" onclick=\"selectOption(this, 'options1')\" onkeydown=\"handleRadioKeys(event, this, 'options1')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M12 3c4.418 0 8 3.134 8 7 0 4.418-3.582 8-8 8-3.866 0-7-3.582-7-8 0-3.866 3.134-7 7-7Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M8.5 13.5c1.5 1.8 4 1.8 5.5 0M12 6v3M16 7l-2 2M8 7l2 2\" stroke=\"#111\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/><\/svg>\n\n <\/div>\n\n <div>Estou a come\u00e7ar do zero<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"2\" data-summary=\"Rebranding\" onclick=\"selectOption(this, 'options1')\" onkeydown=\"handleRadioKeys(event, this, 'options1')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M20 12a8 8 0 1 1-2.343-5.657\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M20 5v5h-5\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>J\u00e1 tenho uma marca, mas preciso de rebranding<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"3\" data-summary=\"Escalar\" onclick=\"selectOption(this, 'options1')\" onkeydown=\"handleRadioKeys(event, this, 'options1')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M14 10l-4 4\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M14.5 4.5c3 0 5 2 5 5 0 5.5-6 10-8.5 10S5 18 5 12.5c0-3 2-5 5-5 0 0 1.5-3 4.5-3Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>A minha marca j\u00e1 existe e quero escalar<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <\/div>\n\n <div id=\"err1\" class=\"error\" role=\"alert\" aria-live=\"polite\">Seleciona uma op\u00e7\u00e3o para continuar.<\/div>\n\n <div class=\"nav\">\n\n <span><\/span>\n\n <button type=\"button\" class=\"btn btn-primary\" onclick=\"nextStep(1)\">Continuar<\/button>\n\n <\/div>\n\n <\/section>\n\n \n\n <!-- Step 2 (multi-select) -->\n\n <section class=\"step\" id=\"step2\" aria-labelledby=\"step2-title\">\n\n <h2 id=\"step2-title\" class=\"step-title\"><span class=\"k\" aria-hidden=\"true\">2<\/span> O que precisas neste momento?<\/h2>\n\n <p class=\"step-description hint\">Podes escolher v\u00e1rias op\u00e7\u00f5es.<\/p>\n\n <div class=\"options\" id=\"options2\" role=\"group\" aria-label=\"Necessidades\">\n\n <div class=\"option\" role=\"checkbox\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Cria\u00e7\u00e3o de identidade visual\" onclick=\"toggleOption(this)\" onkeydown=\"handleCheckKeys(event, this)\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M12 4a8 8 0 1 0 0 16h1.5a2.5 2.5 0 0 0 0-5H12a2 2 0 1 1 0-4h.5a2.5 2.5 0 0 0 0-5H12Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>Cria\u00e7\u00e3o de identidade visual<\/div>\n\n <div class=\"check\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"checkbox\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Website profissional\" onclick=\"toggleOption(this)\" onkeydown=\"handleCheckKeys(event, this)\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M3 12h18M12 3c3 4 3 14 0 18\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>Website profissional<\/div>\n\n <div class=\"check\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"checkbox\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Gest\u00e3o de redes sociais\" onclick=\"toggleOption(this)\" onkeydown=\"handleCheckKeys(event, this)\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"6\" cy=\"12\" r=\"3\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"18\" cy=\"6\" r=\"3\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"18\" cy=\"18\" r=\"3\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M8.6 10.8 15.4 7.2M8.6 13.2l6.8 3.6\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>Gest\u00e3o de redes sociais<\/div>\n\n <div class=\"check\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"checkbox\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Estrat\u00e9gia de conte\u00fado\" onclick=\"toggleOption(this)\" onkeydown=\"handleCheckKeys(event, this)\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M4 20l5-1.2L19.2 8.6a2 2 0 0 0 0-2.8l-.9-.9a2 2 0 0 0-2.8 0L5.3 15.1 4 20Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>Estrat\u00e9gia de conte\u00fado<\/div>\n\n <div class=\"check\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"checkbox\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Campanhas de publicidade digital\" onclick=\"toggleOption(this)\" onkeydown=\"handleCheckKeys(event, this)\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M4 14V8l10-3v12L4 14Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M14 7.5c2 .5 3.5 2.2 3.5 4.5S16 16 14 16.5\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M6 14 v2.5a2.5 2.5 0 0 0 5 0V14\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>Campanhas de publicidade digital<\/div>\n\n <div class=\"check\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"checkbox\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Forma\u00e7\u00e3o para a equipa\" onclick=\"toggleOption(this)\" onkeydown=\"handleCheckKeys(event, this)\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M3 10.5 12 6l9 4.5-9 4.5-9-4.5Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M6 12v4.5c2 2 10 2 12 0V12\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg>\n\n <\/div>\n\n <div>Forma\u00e7\u00e3o para a equipa<\/div>\n\n <div class=\"check\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"checkbox\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Consultoria estrat\u00e9gica cont\u00ednua\" onclick=\"toggleOption(this)\" onkeydown=\"handleCheckKeys(event, this)\">\n\n <div class=\"option-icon\" aria-hidden=\"true\">\n\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"8.5\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"12\" cy=\"12\" r=\"4.5\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"12\" cy=\"12\" r=\"1.2\" fill=\"#111\"\/><\/svg>\n\n <\/div>\n\n <div>Consultoria estrat\u00e9gica cont\u00ednua<\/div>\n\n <div class=\"check\">\u2713<\/div>\n\n <\/div>\n\n <\/div>\n\n <div id=\"chips2\" class=\"chips\" aria-live=\"polite\"><\/div>\n\n <div class=\"nav\">\n\n <button type=\"button\" class=\"btn btn-back\" onclick=\"prevStep(2)\">Voltar<\/button>\n\n <button type=\"button\" class=\"btn btn-primary\" onclick=\"nextStep(2)\">Continuar<\/button>\n\n <\/div>\n\n <\/section>\n\n \n\n <!-- Step 3 (auto-advance) -->\n\n <section class=\"step\" id=\"step3\" data-autoadvance=\"true\" aria-labelledby=\"step3-title\">\n\n <h2 id=\"step3-title\" class=\"step-title\"><span class=\"k\" aria-hidden=\"true\">3<\/span> Quantas p\u00e1ginas ter\u00e1 o teu website?<\/h2>\n\n <p class=\"step-description hint\">Escolhe uma op\u00e7\u00e3o.<\/p>\n\n <div class=\"options\" id=\"options3\" role=\"radiogroup\" aria-label=\"Tamanho do website\">\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"0\" data-summary=\"One Page\" onclick=\"selectOption(this, 'options3')\" onkeydown=\"handleRadioKeys(event, this, 'options3')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M7 3h7l5 5v13H7V3Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg><\/div>\n\n <div>One Page<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"3 a 5 p\u00e1ginas\" onclick=\"selectOption(this, 'options3')\" onkeydown=\"handleRadioKeys(event, this, 'options3')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect x=\"5\" y=\"4\" width=\"12\" height=\"16\" rx=\"2\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M8 7h6M8 10h6M8 13h6\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg><\/div>\n\n <div>3 a 5 p\u00e1ginas<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"2\" data-summary=\"6+ p\u00e1ginas\" onclick=\"selectOption(this, 'options3')\" onkeydown=\"handleRadioKeys(event, this, 'options3')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M3 7h7l2 2h9v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg><\/div>\n\n <div>Mais de 6 p\u00e1ginas<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"0\" data-summary=\"Indefinido\" onclick=\"selectOption(this, 'options3')\" onkeydown=\"handleRadioKeys(event, this, 'options3')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M9.5 9a2.5 2.5 0 0 1 5 0c0 2-2.5 2-2.5 4\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"12\" cy=\"17\" r=\"1\" fill=\"#111\"\/><\/svg><\/div>\n\n <div>N\u00e3o tenho definido<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <\/div>\n\n <div id=\"err3\" class=\"error\" role=\"alert\" aria-live=\"polite\">Seleciona uma op\u00e7\u00e3o para continuar.<\/div>\n\n <div class=\"nav\">\n\n <button type=\"button\" class=\"btn btn-back\" onclick=\"prevStep(3)\">Voltar<\/button>\n\n <button type=\"button\" class=\"btn btn-primary\" onclick=\"nextStep(3)\">Continuar<\/button>\n\n <\/div>\n\n <\/section>\n\n \n\n <!-- Step 4 (auto-advance) -->\n\n <section class=\"step\" id=\"step4\" data-autoadvance=\"true\" aria-labelledby=\"step4-title\">\n\n <h2 id=\"step4-title\" class=\"step-title\"><span class=\"k\" aria-hidden=\"true\">4<\/span> Acompanhamento ap\u00f3s o lan\u00e7amento?<\/h2>\n\n <p class=\"step-description hint\">Escolhe uma op\u00e7\u00e3o.<\/p>\n\n <div class=\"options\" id=\"options4\" role=\"radiogroup\" aria-label=\"Acompanhamento\">\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"2\" data-summary=\"Acompanhamento TMB\" onclick=\"selectOption(this, 'options4')\" onkeydown=\"handleRadioKeys(event, this, 'options4')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M7 12l3 3a2 2 0 0 0 3 0l4-4M3 10l4 4M21 8l-4 4\" stroke=\"#111\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/><\/svg><\/div>\n\n <div>Sim, quero acompanhamento da ag\u00eancia<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"0\" data-summary=\"Equipa interna\" onclick=\"selectOption(this, 'options4')\" onkeydown=\"handleRadioKeys(event, this, 'options4')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"8\" cy=\"8\" r=\"3\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"16\" cy=\"10\" r=\"2.5\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M3.5 19c.4-3 3-5 6-5s5.6 2 6 5M14 19c0-2 1.8-3.5 4-3.5\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg><\/div>\n\n <div>N\u00e3o, a equipa interna vai implementar<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"0\" data-summary=\"Indefinido\" onclick=\"selectOption(this, 'options4')\" onkeydown=\"handleRadioKeys(event, this, 'options4')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M9.5 9a2.5 2.5 0 0 1 5 0c0 2-2.5 2-2.5 4\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"12\" cy=\"17\" r=\"1\" fill=\"#111\"\/><\/svg><\/div>\n\n <div>N\u00e3o tenho definido<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <\/div>\n\n <div id=\"err4\" class=\"error\" role=\"alert\" aria-live=\"polite\">Seleciona uma op\u00e7\u00e3o para continuar.<\/div>\n\n <div class=\"nav\">\n\n <button type=\"button\" class=\"btn btn-back\" onclick=\"prevStep(4)\">Voltar<\/button>\n\n <button type=\"button\" class=\"btn btn-primary\" onclick=\"nextStep(4)\">Continuar<\/button>\n\n <\/div>\n\n <\/section>\n\n \n\n <!-- Step 5 -->\n\n <section class=\"step\" id=\"step5\" aria-labelledby=\"step5-title\">\n\n <h2 id=\"step5-title\" class=\"step-title\"><span class=\"k\" aria-hidden=\"true\">5<\/span> Precisas de forma\u00e7\u00e3o para manter o n\u00edvel da marca?<\/h2>\n\n <p class=\"step-description hint\">Escolhe uma op\u00e7\u00e3o.<\/p>\n\n <div class=\"options\" id=\"options5\" role=\"radiogroup\" aria-label=\"Forma\u00e7\u00e3o\">\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"1\" data-summary=\"Com forma\u00e7\u00e3o\" onclick=\"selectOption(this, 'options5')\" onkeydown=\"handleRadioKeys(event, this, 'options5')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M3 10.5 12 6l9 4.5-9 4.5-9-4.5Z\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M6 12v4.5c2 2 10 2 12 0V12\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg><\/div>\n\n <div>Sim, quero formar a equipa<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"0\" data-summary=\"Sem forma\u00e7\u00e3o\" onclick=\"selectOption(this, 'options5')\" onkeydown=\"handleRadioKeys(event, this, 'options5')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"8.5\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M8 8l8 8\" stroke=\"#111\" stroke-width=\"1.5\"\/><\/svg><\/div>\n\n <div>N\u00e3o preciso neste momento<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <div class=\"option\" role=\"radio\" aria-checked=\"false\" tabindex=\"0\" data-value=\"0\" data-summary=\"Indefinido\" onclick=\"selectOption(this, 'options5')\" onkeydown=\"handleRadioKeys(event, this, 'options5')\">\n\n <div class=\"option-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"#111\" stroke-width=\"1.5\"\/><path d=\"M9.5 9a2.5 2.5 0 0 1 5 0c0 2-2.5 2-2.5 4\" stroke=\"#111\" stroke-width=\"1.5\"\/><circle cx=\"12\" cy=\"17\" r=\"1\" fill=\"#111\"\/><\/svg><\/div>\n\n <div>N\u00e3o tenho definido<\/div>\n\n <div class=\"check radio\">\u2713<\/div>\n\n <\/div>\n\n <\/div>\n\n <div id=\"err5\" class=\"error\" role=\"alert\" aria-live=\"polite\">Seleciona uma op\u00e7\u00e3o para ver o resultado.<\/div>\n\n <div class=\"nav\">\n\n <button type=\"button\" class=\"btn btn-back\" onclick=\"prevStep(5)\">Voltar<\/button>\n\n <button type=\"button\" id=\"btn-result\" class=\"btn btn-primary\" onclick=\"calculateResult()\">Ver Resultado<\/button>\n\n <\/div>\n\n <\/section>\n\n \n\n <!-- Results A -->\n\n <section class=\"result\" id=\"resultA\" aria-labelledby=\"resultA-title\">\n\n <div class=\"result-head\">\n\n <div class=\"result-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M12 21V12\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><path d=\"M12 12c0-3 2.5-5.5 5.5-5.5 0 3-2.5 5.5-5.5 5.5Z\" stroke-width=\"1.6\"\/><path d=\"M12 12c0-3-2.5-5.5-5.5-5.5 0 3 2.5 5.5 5.5 5.5Z\" stroke-width=\"1.6\"\/><\/svg><\/div>\n\n <h2 id=\"resultA-title\" class=\"result-title\">BeeStrategy\u2122 Essencial<\/h2>\n\n <div class=\"result-price\">Estimativa: entre 4.500 \u20ac e 6.000 \u20ac<\/div>\n\n <p class=\"result-description\">Para marcas que est\u00e3o a come\u00e7ar e querem construir uma base s\u00f3lida.<\/p>\n\n <\/div>\n\n <div class=\"result-includes\">\n\n <p class=\"result-includes-title\">Inclui:<\/p>\n\n <ul>\n\n <li>Identidade visual completa (log\u00f3tipo, varia\u00e7\u00f5es, paleta de cores, tipografia, elementos gr\u00e1ficos, Brand Book)<\/li>\n\n <li>1 p\u00e1gina de website (estrutura estrat\u00e9gica e design responsivo)<\/li>\n\n <li>Imagens de perfil e capa para redes sociais<\/li>\n\n <li>5 templates de redes sociais<\/li>\n\n <li>Cart\u00e3o de vista e assinatura de email<\/li>\n\n <li>Mockups para visualiza\u00e7\u00e3o<\/li>\n\n <li>1 m\u00eas de linha editorial (temas, textos, roteiros e legendas prontos a implementar)<\/li>\n\n <li>2 horas de forma\u00e7\u00e3o para garantir aplica\u00e7\u00e3o correta da marca<\/li>\n\n <li>Dura\u00e7\u00e3o: 8 a 10 semanas<\/li>\n\n <\/ul>\n\n <\/div>\n\n <p class=\"result-tip\">\ud83d\udccd Come\u00e7a com solidez e evita retrabalho mais tarde.<\/p>\n\n <a class=\"btn btn-cta\" href=\"https:\/\/calendly.com\/themediabees\" target=\"_blank\" rel=\"noopener nofollow\">Agendar Call Gratuita<\/a>\n\n <p class=\"cta-note\">Sem compromisso. 15\u201320 min.<\/p>\n\n <a class=\"btn btn-secondary\" href=\"https:\/\/themediabees.pt\/contacto\" target=\"_blank\" rel=\"noopener\">Quero apenas um servi\u00e7o e n\u00e3o um projeto completo<\/a>\n\n \n\n <!-- Accordions -->\n\n <div class=\"service-details\">\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Branding Completo<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Log\u00f3tipo (com varia\u00e7\u00f5es)<\/li><li>Paleta de cores e tipografia<\/li><li>Elementos gr\u00e1ficos exclusivos<\/li><li>Brand Book<\/li><li>Cart\u00e3o de visita e assinatura de e-mail<\/li><li>Imagens de perfil\/capas para redes<\/li><li>5 templates de redes<\/li><li>Mockups de aplica\u00e7\u00e3o<\/li><li>Ficheiros prontos e edit\u00e1veis<\/li><\/ul><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Website Estrat\u00e9gico<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Design personalizado e responsivo<\/li><li>Estrutura orientada \u00e0 convers\u00e3o<\/li><li>SEO t\u00e9cnico e performance<\/li><li>Copywriting persuasivo<\/li><li>Integra\u00e7\u00f5es (WhatsApp, formul\u00e1rios, tracking)<\/li><li>Painel de gest\u00e3o intuitivo<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d O teu site a trabalhar por ti \u2014 mesmo quando est\u00e1s offline.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Linha Editorial<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Temas e conte\u00fados alinhados \u00e0 marca<\/li><li>Calend\u00e1rio estrat\u00e9gico<\/li><li>Copy para legendas<\/li><li>Orienta\u00e7\u00f5es de formato e estilo<\/li><\/ul><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Fluxos Inteligentes de IA (Opcional)<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Agentes IA para WhatsApp<\/li><li>Assistentes no site<\/li><li>Automa\u00e7\u00e3o de respostas<\/li><li>Personaliza\u00e7\u00e3o por comportamento<\/li><\/ul><\/div><\/div>\n\n <\/div>\n\n <button type=\"button\" class=\"btn btn-restart\" onclick=\"restartCalculator()\">Recome\u00e7ar calculadora<\/button>\n\n <\/section>\n\n \n\n <!-- Results B -->\n\n <section class=\"result\" id=\"resultB\" aria-labelledby=\"resultB-title\">\n\n <div class=\"result-head\"><div class=\"badge-popular\">Mais escolhido<\/div>\n\n <div class=\"result-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M3 12a9 9 0 0 1 14.9-6.36\" stroke-width=\"1.6\"\/><path d=\"M7 4v4h4\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><path d=\"M21 12a9 9 0 0 1-14.9 6.36\" stroke-width=\"1.6\"\/><path d=\"M17 20v-4h-4\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><\/svg><\/div>\n\n <h2 id=\"resultB-title\" class=\"result-title\">BeeStrategy\u2122 Avan\u00e7ado<\/h2>\n\n <div class=\"result-price\">Estimativa: entre 7.500 \u20ac e 12.000 \u20ac<\/div>\n\n <p class=\"result-description\">Para marcas que j\u00e1 existem, mas precisam de reposicionar-se, crescer e alinhar comunica\u00e7\u00e3o.<\/p>\n\n <\/div>\n\n <div class=\"result-includes\">\n\n <p class=\"result-includes-title\">Inclui:<\/p>\n\n <ul>\n\n <li>Rebranding estrat\u00e9gico (nova identidade visual e verbal)<\/li>\n\n <li>Website profissional (at\u00e9 5 p\u00e1ginas), com copywriting estrat\u00e9gico e SEO base<\/li>\n\n <li>Estrat\u00e9gia de comunica\u00e7\u00e3o<\/li>\n\n <li>Kit de presen\u00e7a digital completo<\/li>\n\n <li>Redes sociais: 2 meses de linha editorial, sendo o primeiro m\u00eas implementado pela ag\u00eancia<\/li>\n\n <li>Campanha de lan\u00e7amento (ads inclu\u00eddos)<\/li>\n\n <li>6 horas de forma\u00e7\u00e3o para equipas<\/li>\n\n <li>Dura\u00e7\u00e3o: 12 a 16 semanas<\/li>\n\n <\/ul>\n\n <\/div>\n\n <p class=\"result-footnote\">*Or\u00e7amento de m\u00eddia pago n\u00e3o inclu\u00eddo; gest\u00e3o e configura\u00e7\u00e3o inclu\u00eddas.*<\/p>\n\n <p class=\"result-tip\">\ud83d\udccd Reposiciona a tua marca e volta ao radar dos clientes certos.<\/p>\n\n <a class=\"btn btn-cta\" href=\"https:\/\/calendly.com\/themediabees\" target=\"_blank\" rel=\"noopener nofollow\">Agendar Call Gratuita<\/a>\n\n <p class=\"cta-note\">Sem compromisso. 15\u201320 min.<\/p>\n\n <a class=\"btn btn-secondary\" href=\"https:\/\/themediabees.pt\/contactos\" target=\"_blank\" rel=\"noopener\">Quero apenas um servi\u00e7o e n\u00e3o um projeto completo<\/a>\n\n \n\n <div class=\"service-details\">\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>\ud83d\udd04 Rebranding Estrat\u00e9gico<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Diagn\u00f3stico e an\u00e1lise de mercado<\/li><li>Reposicionamento completo<\/li><li>Nova identidade visual<\/li><li>Tom de voz e mensagens<\/li><li>Manual da nova marca<\/li><li>Templates e mockups<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d Destaca-te com for\u00e7a renovada.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Website Estrat\u00e9gico<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Design personalizado e responsivo<\/li><li>Estrutura orientada \u00e0 convers\u00e3o<\/li><li>SEO t\u00e9cnico e performance<\/li><li>Copywriting persuasivo<\/li><li>Integra\u00e7\u00f5es essenciais<\/li><li>P\u00e1ginas essenciais (servi\u00e7os, contacto, blog...)<\/li><li>Painel de gest\u00e3o intuitivo<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d O teu site a trabalhar por ti \u2014 mesmo quando est\u00e1s offline.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Linha Editorial<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Temas e calend\u00e1rio para 2 meses<\/li><li>Copy para legendas<\/li><li>Orienta\u00e7\u00f5es de formato e estilo<\/li><li>Estrat\u00e9gia de hashtags<\/li><\/ul><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Campanhas de Publicidade<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Defini\u00e7\u00e3o de objetivos e p\u00fablicos<\/li><li>Criativos e copy<\/li><li>Configura\u00e7\u00e3o t\u00e9cnica<\/li><li>Testes A\/B e otimiza\u00e7\u00e3o<\/li><li>Relat\u00f3rio com KPIs<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d Menor custo, maior impacto.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Fluxos Inteligentes de IA (Opcional)<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Agentes IA para WhatsApp<\/li><li>Assistentes virtuais no site<\/li><li>Automa\u00e7\u00e3o e personaliza\u00e7\u00e3o<\/li><\/ul><\/div><\/div>\n\n <\/div>\n\n <button type=\"button\" class=\"btn btn-restart\" onclick=\"restartCalculator()\">Recome\u00e7ar calculadora<\/button>\n\n <\/section>\n\n \n\n <!-- Results C -->\n\n <section class=\"result\" id=\"resultC\" aria-labelledby=\"resultC-title\">\n\n <div class=\"result-head\">\n\n <div class=\"result-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M3 17l6-6 4 4 8-8\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><path d=\"M14 5h7v7\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/div>\n\n <h2 id=\"resultC-title\" class=\"result-title\">BeeStrategy\u2122 Elite<\/h2>\n\n <div class=\"result-price\">Estimativa: entre 15.000 \u20ac e 20.000 \u20ac<\/div>\n\n <p class=\"result-description\">Para marcas que querem escalar, conquistar autoridade e crescer com consist\u00eancia.<\/p>\n\n <\/div>\n\n <div class=\"result-includes\">\n\n <p class=\"result-includes-title\">Inclui tudo do pacote avan\u00e7ado, e ainda:<\/p>\n\n <ul>\n\n <li>Gest\u00e3o de redes sociais por 3 meses com produ\u00e7\u00e3o de conte\u00fados pela ag\u00eancia<\/li>\n\n <li>1 m\u00eas extra de linha editorial para uso posterior pela marca<\/li>\n\n <li>Estrat\u00e9gia de crescimento cont\u00ednuo<\/li>\n\n <li>Consultoria estrat\u00e9gica e suporte ativo<\/li>\n\n <li>10 horas de forma\u00e7\u00e3o para capacitar a equipa e manter a excel\u00eancia<\/li>\n\n <li>Dura\u00e7\u00e3o: 16+ semanas<\/li>\n\n <\/ul>\n\n <\/div>\n\n <p class=\"result-footnote\">*Or\u00e7amento de m\u00eddia pago n\u00e3o inclu\u00eddo; gest\u00e3o e configura\u00e7\u00e3o inclu\u00eddas.*<\/p>\n\n <p class=\"result-tip\">\ud83d\udccd Cresce com estrat\u00e9gia, sem perder a tua ess\u00eancia.<\/p>\n\n <a class=\"btn btn-cta\" href=\"https:\/\/calendly.com\/themediabees\" target=\"_blank\" rel=\"noopener nofollow\">Agendar Call Gratuita<\/a>\n\n <p class=\"cta-note\">Sem compromisso. 15\u201320 min.<\/p>\n\n <a class=\"btn btn-secondary\" href=\"https:\/\/themediabees.pt\/contactos\" target=\"_blank\" rel=\"noopener\">Quero apenas um servi\u00e7o e n\u00e3o um projeto completo<\/a>\n\n \n\n <div class=\"service-details\">\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Branding Avan\u00e7ado<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Log\u00f3tipo (com varia\u00e7\u00f5es)<\/li><li>Paleta de cores e tipografia<\/li><li>Elementos gr\u00e1ficos exclusivos<\/li><li>Brand Book<\/li><li>Cart\u00e3o de visita e assinatura de e-mail<\/li><li>Imagens de perfil\/capas para redes<\/li><li>5 templates de redes<\/li><li>Mockups de aplica\u00e7\u00e3o<\/li><li>Ficheiros prontos e edit\u00e1veis<\/li><\/ul><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Website Completo<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Design personalizado e responsivo<\/li><li>Estrutura orientada \u00e0 convers\u00e3o<\/li><li>SEO t\u00e9cnico e performance<\/li><li>Copywriting persuasivo<\/li><li>Integra\u00e7\u00f5es essenciais<\/li><li>P\u00e1ginas essenciais (servi\u00e7os, contacto, blog...)<\/li><li>Painel de gest\u00e3o intuitivo<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d O teu site a trabalhar por ti \u2014 mesmo quando est\u00e1s offline.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Linha Editorial<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Temas e calend\u00e1rio para 3 meses<\/li><li>Copy para legendas<\/li><li>Orienta\u00e7\u00f5es de formato e estilo<\/li><li>An\u00e1lise de m\u00e9tricas e otimiza\u00e7\u00e3o<\/li><\/ul><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Gest\u00e3o de Redes Sociais<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Estrat\u00e9gia, planeamento e produ\u00e7\u00e3o<\/li><li>Design e copy<\/li><li>Gest\u00e3o di\u00e1ria e relat\u00f3rios<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d Presen\u00e7a ativa e coerente nos canais certos.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Campanhas de Publicidade<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Objetivos, p\u00fablico e criativos<\/li><li>Configura\u00e7\u00f5es, testes A\/B e otimiza\u00e7\u00e3o<\/li><li>Relat\u00f3rios e recomenda\u00e7\u00f5es<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d Menor custo, maior impacto.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Consultoria & Forma\u00e7\u00e3o<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Sess\u00f5es personalizadas de branding e conte\u00fado<\/li><li>Linha editorial completa<\/li><li>Templates prontos<\/li><li>Workshops para equipas<\/li><\/ul><p class=\"service-tagline\">\ud83d\udc1d Continuidade e qualidade, com ou sem acompanhamento mensal.<\/p><\/div><\/div>\n\n <div class=\"service-accordion\"><div class=\"service-header\" onclick=\"toggleAccordion(this)\"><span>Fluxos Inteligentes de IA (Opcional)<\/span><span>+<\/span><\/div><div class=\"service-content\"><ul><li>Agentes IA para WhatsApp<\/li><li>Assistentes virtuais no site<\/li><li>Automa\u00e7\u00e3o e personaliza\u00e7\u00e3o<\/li><\/ul><\/div><\/div>\n\n <\/div>\n\n <button type=\"button\" class=\"btn btn-restart\" onclick=\"restartCalculator()\">Recome\u00e7ar calculadora<\/button>\n\n <\/section>\n\n <\/main>\n\n \n\n <!-- Summary aside -->\n\n <aside class=\"aside card\">\n\n <div class=\"summary\">\n\n <h3>Resumo<\/h3>\n\n <p class=\"summary-empty\" id=\"summary-empty\">As tuas escolhas aparecem aqui.<\/p>\n\n <dl id=\"summary-list\" hidden>\n\n <dt>Fase<\/dt>\n\n <dd id=\"sum-step1\">\u2014<\/dd>\n\n <dt>Necessidades<\/dt>\n\n <dd id=\"sum-step2\">\u2014<\/dd>\n\n <dt>Website<\/dt>\n\n <dd id=\"sum-step3\">\u2014<\/dd>\n\n <dt>Acompanhamento<\/dt>\n\n <dd id=\"sum-step4\">\u2014<\/dd>\n\n <dt>Forma\u00e7\u00e3o<\/dt>\n\n <dd id=\"sum-step5\">\u2014<\/dd>\n\n <\/dl>\n\n <\/div>\n\n <\/aside>\n\n <\/div>\n\n <\/div>\n\n \n\n <script>\n\n \/\/ ===== State =====\n\n let currentStep = 1;\n\n const totalSteps = 5;\n\n const answers = { step1: 0, step2: 0, step3: 0, step4: 0, step5: 0 };\n\n const summary = { step1: '', step2: [], step3: '', step4: '', step5: '' };\n\n \n\n \/\/ ===== UI updates =====\n\n function updateProgress(){\n\n const pct = (currentStep-1) \/ totalSteps * 100; \/\/ completed portion\n\n document.getElementById('progress').style.width = pct + '%';\n\n for (let i=1;i<=totalSteps;i++){\n\n const el = document.getElementById('s-dot-'+i);\n\n el.classList.remove('active','done');\n\n if (i < currentStep) el.classList.add('done');\n\n if (i === currentStep) el.classList.add('active');\n\n }\n\n \/\/ Auto-scroll do stepper em mobile, para manter o passo vis\u00edvel\n\n const scroller = document.querySelector('.stepper');\n\n const activeDot = document.getElementById('s-dot-'+currentStep);\n\n if (scroller && activeDot) {\n\n const offsetLeft = activeDot.offsetLeft;\n\n const target = Math.max(0, offsetLeft - (scroller.clientWidth\/2 - activeDot.clientWidth\/2));\n\n if (Math.abs(scroller.scrollLeft - target) > 8) {\n\n scroller.scrollTo({ left: target, behavior: 'smooth' });\n\n }\n\n }\n\n }\n\n \n\n function showError(stepId){\n\n const err = document.getElementById('err'+stepId);\n\n if (!err) return;\n\n err.classList.add('show');\n\n setTimeout(()=>err.classList.remove('show'), 2200);\n\n }\n\n \n\n function updateSummary(){\n\n const empty = document.getElementById('summary-empty');\n\n const list = document.getElementById('summary-list');\n\n const has = summary.step1 || summary.step2.length || summary.step3 || summary.step4 || summary.step5;\n\n if (has){ empty.style.display='none'; list.hidden=false; } else { empty.style.display='block'; list.hidden=true; }\n\n document.getElementById('sum-step1').textContent = summary.step1 || '\u2014';\n\n document.getElementById('sum-step2').textContent = summary.step2.length? summary.step2.join(', '): '\u2014';\n\n document.getElementById('sum-step3').textContent = summary.step3 || '\u2014';\n\n document.getElementById('sum-step4').textContent = summary.step4 || '\u2014';\n\n document.getElementById('sum-step5').textContent = summary.step5 || '\u2014';\n\n }\n\n \n\n \/\/ ===== Helpers =====\n\n function setStep5CtaVisibility(){\n\n const btn = document.getElementById('btn-result');\n\n if (!btn) return;\n\n const hasSelection = document.querySelector('#options5 .option.selected');\n\n btn.style.display = hasSelection ? 'inline-flex' : 'none';\n\n }\n\n \n\n \/\/ ===== Selection controls =====\n\n function selectOption(element, groupId){\n\n const options = document.querySelectorAll('#' + groupId + ' .option');\n\n options.forEach(o => { o.classList.remove('selected'); o.setAttribute('aria-checked','false'); });\n\n element.classList.add('selected');\n\n element.setAttribute('aria-checked','true');\n\n const stepNumber = parseInt(groupId.replace('options',''), 10);\n\n answers['step'+stepNumber] = parseInt(element.getAttribute('data-value'), 10) || 0;\n\n const sumText = element.getAttribute('data-summary') || element.innerText.trim();\n\n summary['step'+stepNumber] = sumText;\n\n updateSummary();\n\n \n\n \/\/ Mostrar CTA do passo 5 s\u00f3 ap\u00f3s sele\u00e7\u00e3o\n\n if (stepNumber === 5) setStep5CtaVisibility();\n\n \n\n \/\/ Auto-advance nos passos de escolha \u00fanica marcados com data-autoadvance\n\n const section = document.getElementById('step'+stepNumber);\n\n const isAuto = section && section.dataset.autoadvance === 'true';\n\n if (isAuto) setTimeout(()=>nextStep(stepNumber), 120);\n\n }\n\n \n\n function toggleOption(element){\n\n const was = element.classList.contains('selected');\n\n element.classList.toggle('selected');\n\n element.setAttribute('aria-checked', String(!was));\n\n const selected = document.querySelectorAll('#options2 .option.selected');\n\n answers.step2 = selected.length; \/\/ 1 ponto por op\u00e7\u00e3o\n\n summary.step2 = Array.from(selected).map(el=> el.getAttribute('data-summary'));\n\n updateSummary();\n\n renderChips2();\n\n }\n\n \n\n \/\/ Chips renderer for step 2\n\n function renderChips2(){\n\n const cont = document.getElementById('chips2');\n\n if (!cont) return;\n\n cont.innerHTML = '';\n\n summary.step2.forEach(label => {\n\n const chip = document.createElement('button');\n\n chip.type = 'button';\n\n chip.className = 'chip';\n\n chip.dataset.label = label;\n\n chip.innerHTML = `${label}<span aria-hidden=\"true\">\u00d7<\/span>`;\n\n chip.addEventListener('click', () => {\n\n const el = Array.from(document.querySelectorAll('#options2 .option'))\n\n .find(o => o.getAttribute('data-summary') === label);\n\n if (el && el.classList.contains('selected')) toggleOption(el);\n\n });\n\n cont.appendChild(chip);\n\n });\n\n cont.style.display = summary.step2.length ? 'flex' : 'none';\n\n }\n\n \n\n \/\/ Keyboard support\n\n function handleRadioKeys(e, el, groupId){\n\n const opts = Array.from(document.querySelectorAll('#'+groupId+' .option'));\n\n const idx = opts.indexOf(el);\n\n if (e.key==='ArrowDown' || e.key==='ArrowRight'){ e.preventDefault(); (opts[idx+1]||opts[0]).focus(); }\n\n if (e.key==='ArrowUp' || e.key==='ArrowLeft'){ e.preventDefault(); (opts[idx-1]||opts[opts.length-1]).focus(); }\n\n if (e.key===' ' || e.key==='Enter'){ e.preventDefault(); selectOption(el, groupId); }\n\n }\n\n function handleCheckKeys(e, el){ if (e.key===' ' || e.key==='Enter'){ e.preventDefault(); toggleOption(el); } }\n\n \n\n \/\/ Navigation\n\n function nextStep(step){\n\n if (step !== 2){\n\n const hasSelection = document.querySelector('#options'+step+' .option.selected');\n\n if (!hasSelection){ showError(step); return; }\n\n }\n\n document.getElementById('step'+step).classList.remove('active');\n\n currentStep++;\n\n document.getElementById('step'+currentStep).classList.add('active');\n\n updateProgress();\n\n const first = document.querySelector('#options'+currentStep+' .option');\n\n if (first) setTimeout(()=>first.focus(), 50);\n\n }\n\n \n\n function prevStep(step){\n\n document.getElementById('step'+step).classList.remove('active');\n\n currentStep--;\n\n document.getElementById('step'+currentStep).classList.add('active');\n\n updateProgress();\n\n const first = document.querySelector('#options'+currentStep+' .option');\n\n if (first) setTimeout(()=>first.focus(), 50);\n\n }\n\n \n\n function calculateResult(){\n\n const hasSelection = document.querySelector('#options5 .option.selected');\n\n if (!hasSelection){ showError(5); return; }\n\n const score = answers.step1 + answers.step2 + answers.step3 + answers.step4 + answers.step5;\n\n document.getElementById('step'+currentStep).classList.remove('active');\n\n document.querySelectorAll('.result').forEach(r => r.classList.remove('active'));\n\n if (score >= 9){ document.getElementById('resultC').classList.add('active'); }\n\n else if (score >= 5){ document.getElementById('resultB').classList.add('active'); }\n\n else { document.getElementById('resultA').classList.add('active'); }\n\n document.getElementById('progress').style.width = '100%';\n\n for (let i=1;i<=totalSteps;i++){ const el = document.getElementById('s-dot-'+i); el.classList.remove('active'); el.classList.add('done'); }\n\n window.scrollTo({ top: 0, behavior: 'smooth' });\n\n }\n\n \n\n function toggleAccordion(headerEl){\n\n const content = headerEl.nextElementSibling;\n\n const isOpen = content.classList.toggle('active');\n\n const sign = headerEl.querySelector('span:last-child');\n\n if (sign) sign.textContent = isOpen ? '\u2212' : '+';\n\n }\n\n \n\n function restartCalculator(){\n\n Object.keys(answers).forEach(k => answers[k] = 0);\n\n summary.step1=''; summary.step2=[]; summary.step3=''; summary.step4=''; summary.step5='';\n\n document.querySelectorAll('.option').forEach(o => { o.classList.remove('selected'); o.setAttribute('aria-checked','false'); });\n\n document.querySelectorAll('.result').forEach(r => r.classList.remove('active'));\n\n document.querySelectorAll('.service-content').forEach(c => c.classList.remove('active'));\n\n document.querySelectorAll('.service-header span:last-child').forEach(s => s.textContent = '+');\n\n currentStep = 1;\n\n document.querySelectorAll('.step').forEach(s=>s.classList.remove('active'));\n\n document.getElementById('step1').classList.add('active');\n\n updateProgress();\n\n updateSummary();\n\n renderChips2();\n\n setStep5CtaVisibility();\n\n window.scrollTo({ top: 0, behavior: 'smooth' });\n\n }\n\n \n\n \/\/ UTM tagging for all CTAs\n\n function applyUTMs(){\n\n const pkgMap = { resultA: 'essencial', resultB: 'avancado', resultC: 'elite' };\n\n ['resultA','resultB','resultC'].forEach(id => {\n\n const sec = document.getElementById(id);\n\n if(!sec) return;\n\n const pkg = pkgMap[id] || 'na';\n\n sec.querySelectorAll('a.btn-cta, a.btn-secondary').forEach(a => {\n\n const href = a.getAttribute('href');\n\n try {\n\n const url = new URL(href);\n\n const isPrimary = a.classList.contains('btn-cta');\n\n url.searchParams.set('utm_source','beestrategy_calc');\n\n url.searchParams.set('utm_medium', isPrimary ? 'primary_cta' : 'secondary_cta');\n\n url.searchParams.set('utm_campaign', 'beestrategy_' + pkg);\n\n url.searchParams.set('utm_content', isPrimary ? 'agendar_call' : 'servico_contactos');\n\n a.setAttribute('href', url.toString());\n\n } catch(e) { \/* ignore invalid hrefs *\/ }\n\n });\n\n });\n\n }\n\n \n\n \/\/ Stepper helpers (clickable)\n\n function goToStep(n){\n\n if (n < 1 || n > totalSteps) return;\n\n document.querySelectorAll('.step').forEach(s=>s.classList.remove('active'));\n\n document.querySelectorAll('.result').forEach(r=>r.classList.remove('active'));\n\n currentStep = n;\n\n document.getElementById('step'+n).classList.add('active');\n\n updateProgress();\n\n const first = document.querySelector('#options'+currentStep+' .option');\n\n if (first) setTimeout(()=>first.focus(), 50);\n\n }\n\n function attachStepper(){\n\n for (let i=1;i<=totalSteps;i++){\n\n const dot = document.getElementById('s-dot-'+i);\n\n if (!dot) continue;\n\n dot.setAttribute('tabindex','0');\n\n dot.setAttribute('role','button');\n\n dot.addEventListener('click', ()=> goToStep(i));\n\n dot.addEventListener('keydown', (e)=>{ if (e.key==='Enter' || e.key===' ') { e.preventDefault(); goToStep(i);} });\n\n }\n\n }\n\n \n\n \/\/ === Lightweight Test Suite (console) ===\n\n function runTests(){\n\n const results = [];\n\n const ok = (name, pass) => { results.push({ name, pass: !!pass }); if (!pass) console.error('\u274c', name); else console.log('\u2705', name); };\n\n \n\n \/\/ Test 1: updateProgress does not throw and sets width correctly for step 3\n\n try {\n\n const prev = currentStep; currentStep = 3; updateProgress();\n\n const w = document.getElementById('progress').style.width; ok('updateProgress width 40% on step 3', w === '40%');\n\n currentStep = prev; updateProgress();\n\n } catch(e){ ok('updateProgress no-throw', false); }\n\n \n\n \/\/ Test 2: goToStep activates correct section\n\n const prev2 = currentStep; goToStep(2);\n\n ok('goToStep(2) activates step2', document.getElementById('step2').classList.contains('active'));\n\n goToStep(prev2);\n\n \n\n \/\/ Test 3\/4\/5: calculateResult routes to A\/B\/C with a dummy selection in step5\n\n const ensureStep5Selected = () => {\n\n const opt5 = document.querySelector('#options5 .option');\n\n if (opt5 && !opt5.classList.contains('selected')) opt5.classList.add('selected');\n\n answers.step5 = parseInt(opt5?.getAttribute('data-value')||'0',10);\n\n setStep5CtaVisibility();\n\n };\n\n \n\n \/\/ A (score < 5)\n\n answers.step1=0; answers.step2=0; answers.step3=0; answers.step4=0; answers.step5=0; ensureStep5Selected();\n\n calculateResult(); ok('resultA active for low score', document.getElementById('resultA').classList.contains('active'));\n\n restartCalculator();\n\n \n\n \/\/ B (5 <= score < 9)\n\n answers.step1=2; answers.step2=1; answers.step3=1; answers.step4=1; answers.step5=0; ensureStep5Selected();\n\n calculateResult(); ok('resultB active for mid score', document.getElementById('resultB').classList.contains('active'));\n\n restartCalculator();\n\n \n\n \/\/ C (score >= 9)\n\n answers.step1=3; answers.step2=3; answers.step3=2; answers.step4=1; answers.step5=0; ensureStep5Selected();\n\n calculateResult(); ok('resultC active for high score', document.getElementById('resultC').classList.contains('active'));\n\n restartCalculator();\n\n \n\n \/\/ Test 6: auto-advance on single-choice step (step1)\n\n goToStep(1);\n\n selectOption(document.querySelector('#options1 .option'), 'options1');\n\n setTimeout(()=>{\n\n ok('auto-advance from step1 to step2', document.getElementById('step2').classList.contains('active'));\n\n restartCalculator();\n\n }, 180);\n\n \n\n \/\/ Test 7: step5 CTA visible only after selection\n\n const btn = document.getElementById('btn-result');\n\n ok('btn-result hidden by default', getComputedStyle(btn).display === 'none');\n\n selectOption(document.querySelector('#options5 .option'), 'options5');\n\n setTimeout(()=>{\n\n ok('btn-result visible after selection on step5', getComputedStyle(btn).display !== 'none');\n\n restartCalculator();\n\n }, 80);\n\n \n\n console.info('BeeStrategy Test Results:', results);\n\n }\n\n \n\n \/\/ Initialize\n\n updateProgress();\n\n updateSummary();\n\n renderChips2();\n\n setStep5CtaVisibility();\n\n applyUTMs();\n\n attachStepper();\n\n \/\/ Run tests after DOM is ready (and then reset UI)\n\n try { runTests(); } catch(e){ console.warn('Test suite error', e); }\n\n <\/script>\n\n<\/body>\n\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Calculadora BeeStrategy\u2122 \ud83d\udc1d BeeStrategy\u2122 Calculadora BeeStrategy\u2122 Descobre o pacote ideal para onde est\u00e1s e para onde queres ir. 1Fase 2Necessidades 3Website 4Acompanhamento 5Forma\u00e7\u00e3o 1 Em que fase est\u00e1 a tua marca? Escolhe uma op\u00e7\u00e3o. Estou a come\u00e7ar do zero \u2713 J\u00e1 tenho uma marca, mas preciso de rebranding \u2713 A minha marca j\u00e1 existe e […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"inline_featured_image":false,"footnotes":""},"class_list":["post-766","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/pages\/766","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/comments?post=766"}],"version-history":[{"count":26,"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/pages\/766\/revisions"}],"predecessor-version":[{"id":1318,"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/pages\/766\/revisions\/1318"}],"wp:attachment":[{"href":"https:\/\/themediabees.pt\/es\/wp-json\/wp\/v2\/media?parent=766"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}