{"parentUuid":null,"isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":"Project: Covalba EN website (Vite+React18+TS+Tailwind+shadcn/ui). Repo: /opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all . Alias @/=src/.\nTranslated EN copy: /tmp/covalba-en-sectors/public-venues.en.md — sections \"## [section-id] Label\", strings \"- [key] English text\". Use ONLY text after each [key]; markers/labels are NOT displayed.\nRULES: US English, keep metric units (°C, m², %). Product pivot: CTAs sell the coating; applicator = the buyer's own professional contractor, never a recruit. France-specific content is ALREADY stripped from the EN copy — never reintroduce it. Do NOT modify any French file; only CREATE the file listed. Do NOT run npm/tsc/build/git.\nLIVE EN routes for internal links (else → /en): /en, /en/solutions/covatherm, /en/industries/commercial, /en/industries/logistics, /en/industries/retail, /en/industries/public-sector, /en/industries/agriculture, /en/industries/public-venues.\n\nTASK: Build the EN \"public venues\" page (FR \"ERP / établissements recevant du public\" → public venues: shopping centers, leisure & sports facilities, healthcare, hospitality).\n1. READ src/pages/industries/ERP.tsx — it defines a `const config: SectorPageConfig = {...}` passed to a shared template. This is your structural template.\n2. READ the EN copy file above.\n3. (Reference) src/pages/en/CommercialEN.tsx (EN chrome/meta conventions); src/components/en/industries/SectorPageTemplateEN.tsx (the EN template to use).\n4. CREATE src/pages/en/industries/PublicVenuesEN.tsx exporting default `PublicVenuesEN`:\n   - Build an EN `SectorPageConfig` = 1:1 copy of the ERP config STRUCTURE (same fields, icons, image paths) with French values replaced by the matching English [key] strings. slug:'public-venues', canonicalPath:'/en/industries/public-venues'.\n   - OMIT any France-specific config block (CEE/décret 'special') — map whatever the EN copy provides instead.\n   - Import { SectorPageTemplateEN } from '@/components/en/industries/SectorPageTemplateEN', { type SectorPageConfig } from '@/components/industries/SectorPageTemplate', NavbarEN/FooterEN/StickyMobileCTAEN from '@/components/en/...'.\n   - Render inside <div className=\"min-h-screen\">: <NavbarEN /> <SectorPageTemplateEN config={config} /> <FooterEN /> <StickyMobileCTAEN />.\n   - usePageMeta({title, description, canonical:'https://www.covalba.fr/en/industries/public-venues'}) from the EN copy.\nReport the file created + flag any unmapped field."},"uuid":"85800189-5918-44dc-991f-217bbfa297fd","timestamp":"2026-06-21T23:05:01.254Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"85800189-5918-44dc-991f-217bbfa297fd","isSidechain":true,"agentId":"a31f251608c623abc","attachment":{"type":"deferred_tools_delta","addedNames":["CronCreate","CronDelete","CronList","DesignSync","EnterWorktree","ExitWorktree","ListMcpResourcesTool","Monitor","NotebookEdit","PushNotification","ReadMcpResourceTool","RemoteTrigger","TaskCreate","TaskGet","TaskList","TaskStop","TaskUpdate","WebFetch","WebSearch","mcp__EstimanouContent__add_article_block","mcp__EstimanouContent__add_block","mcp__EstimanouContent__create_article","mcp__EstimanouContent__create_page","mcp__EstimanouContent__delete_article","mcp__EstimanouContent__delete_article_block","mcp__EstimanouContent__delete_block","mcp__EstimanouContent__get_article","mcp__EstimanouContent__get_city_page","mcp__EstimanouContent__get_page","mcp__EstimanouContent__list_articles","mcp__EstimanouContent__list_available_blocks","mcp__EstimanouContent__list_city_pages","mcp__EstimanouContent__list_pages","mcp__EstimanouContent__list_site_urls","mcp__EstimanouContent__reorder_article_blocks","mcp__EstimanouContent__reorder_blocks","mcp__EstimanouContent__replace_article_content","mcp__EstimanouContent__replace_city_seo_content","mcp__EstimanouContent__replace_page_layout","mcp__EstimanouContent__search_internal_links","mcp__EstimanouContent__update_article","mcp__EstimanouContent__update_article_block","mcp__EstimanouContent__update_block","mcp__EstimanouContent__update_city_page_content","mcp__claude_ai_Ahref__batch-analysis","mcp__claude_ai_Ahref__brand-radar-ai-responses","mcp__claude_ai_Ahref__brand-radar-ai-responses-entities","mcp__claude_ai_Ahref__brand-radar-cited-domains","mcp__claude_ai_Ahref__brand-radar-cited-domains-entities","mcp__claude_ai_Ahref__brand-radar-cited-pages","mcp__claude_ai_Ahref__brand-radar-cited-pages-entities","mcp__claude_ai_Ahref__brand-radar-impressions-history","mcp__claude_ai_Ahref__brand-radar-impressions-overview","mcp__claude_ai_Ahref__brand-radar-impressions-overview-entities","mcp__claude_ai_Ahref__brand-radar-mentions-history","mcp__claude_ai_Ahref__brand-radar-mentions-history-entities","mcp__claude_ai_Ahref__brand-radar-mentions-overview","mcp__claude_ai_Ahref__brand-radar-mentions-overview-entities","mcp__claude_ai_Ahref__brand-radar-sov-history","mcp__claude_ai_Ahref__brand-radar-sov-history-entities","mcp__claude_ai_Ahref__brand-radar-sov-overview","mcp__claude_ai_Ahref__brand-radar-sov-overview-entities","mcp__claude_ai_Ahref__doc","mcp__claude_ai_Ahref__gsc-anonymous-queries","mcp__claude_ai_Ahref__gsc-ctr-by-position","mcp__claude_ai_Ahref__gsc-keyword-history","mcp__claude_ai_Ahref__gsc-keywords","mcp__claude_ai_Ahref__gsc-metrics-by-country","mcp__claude_ai_Ahref__gsc-page-history","mcp__claude_ai_Ahref__gsc-pages","mcp__claude_ai_Ahref__gsc-pages-history","mcp__claude_ai_Ahref__gsc-performance-by-device","mcp__claude_ai_Ahref__gsc-performance-by-position","mcp__claude_ai_Ahref__gsc-performance-history","mcp__claude_ai_Ahref__gsc-positions-history","mcp__claude_ai_Ahref__keywords-explorer-matching-terms","mcp__claude_ai_Ahref__keywords-explorer-overview","mcp__claude_ai_Ahref__keywords-explorer-related-terms","mcp__claude_ai_Ahref__keywords-explorer-search-suggestions","mcp__claude_ai_Ahref__keywords-explorer-volume-by-country","mcp__claude_ai_Ahref__keywords-explorer-volume-history","mcp__claude_ai_Ahref__management-brand-radar-prompts","mcp__claude_ai_Ahref__management-brand-radar-reports","mcp__claude_ai_Ahref__management-keyword-list-keywords","mcp__claude_ai_Ahref__management-locations","mcp__claude_ai_Ahref__management-project-competitors","mcp__claude_ai_Ahref__management-project-keywords","mcp__claude_ai_Ahref__management-projects","mcp__claude_ai_Ahref__public-crawler-ip-ranges","mcp__claude_ai_Ahref__public-crawler-ips","mcp__claude_ai_Ahref__public-domain-rating-free","mcp__claude_ai_Ahref__rank-tracker-competitors-domains","mcp__claude_ai_Ahref__rank-tracker-competitors-overview","mcp__claude_ai_Ahref__rank-tracker-competitors-pages","mcp__claude_ai_Ahref__rank-tracker-competitors-stats","mcp__claude_ai_Ahref__rank-tracker-overview","mcp__claude_ai_Ahref__rank-tracker-serp-overview","mcp__claude_ai_Ahref__render-data-table","mcp__claude_ai_Ahref__render-scorecard","mcp__claude_ai_Ahref__render-time-series-chart","mcp__claude_ai_Ahref__serp-overview","mcp__claude_ai_Ahref__site-audit-issues","mcp__claude_ai_Ahref__site-audit-page-content","mcp__claude_ai_Ahref__site-audit-page-explorer","mcp__claude_ai_Ahref__site-audit-projects","mcp__claude_ai_Ahref__site-explorer-all-backlinks","mcp__claude_ai_Ahref__site-explorer-anchors","mcp__claude_ai_Ahref__site-explorer-backlinks-stats","mcp__claude_ai_Ahref__site-explorer-broken-backlinks","mcp__claude_ai_Ahref__site-explorer-crawled-pages","mcp__claude_ai_Ahref__site-explorer-domain-rating","mcp__claude_ai_Ahref__site-explorer-domain-rating-history","mcp__claude_ai_Ahref__site-explorer-keywords-history","mcp__claude_ai_Ahref__site-explorer-linked-anchors-external","mcp__claude_ai_Ahref__site-explorer-linked-anchors-internal","mcp__claude_ai_Ahref__site-explorer-linked-domains","mcp__claude_ai_Ahref__site-explorer-metrics","mcp__claude_ai_Ahref__site-explorer-metrics-by-country","mcp__claude_ai_Ahref__site-explorer-metrics-history","mcp__claude_ai_Ahref__site-explorer-organic-competitors","mcp__claude_ai_Ahref__site-explorer-organic-keywords","mcp__claude_ai_Ahref__site-explorer-outlinks-stats","mcp__claude_ai_Ahref__site-explorer-pages-by-backlinks","mcp__claude_ai_Ahref__site-explorer-pages-by-internal-links","mcp__claude_ai_Ahref__site-explorer-pages-by-traffic","mcp__claude_ai_Ahref__site-explorer-pages-history","mcp__claude_ai_Ahref__site-explorer-paid-pages","mcp__claude_ai_Ahref__site-explorer-refdomains-history","mcp__claude_ai_Ahref__site-explorer-referring-domains","mcp__claude_ai_Ahref__site-explorer-top-pages","mcp__claude_ai_Ahref__site-explorer-total-search-volume-history","mcp__claude_ai_Ahref__site-explorer-url-rating-history","mcp__claude_ai_Ahref__social-media-activity-history","mcp__claude_ai_Ahref__social-media-authors","mcp__claude_ai_Ahref__social-media-channel-metrics","mcp__claude_ai_Ahref__social-media-channels","mcp__claude_ai_Ahref__social-media-post-metrics","mcp__claude_ai_Ahref__social-media-posts","mcp__claude_ai_Ahref__subscription-info-limits-and-usage","mcp__claude_ai_Ahref__web-analytics-browser-versions","mcp__claude_ai_Ahref__web-analytics-browser-versions-chart","mcp__claude_ai_Ahref__web-analytics-browsers","mcp__claude_ai_Ahref__web-analytics-browsers-chart","mcp__claude_ai_Ahref__web-analytics-chart","mcp__claude_ai_Ahref__web-analytics-cities","mcp__claude_ai_Ahref__web-analytics-cities-chart","mcp__claude_ai_Ahref__web-analytics-continents","mcp__claude_ai_Ahref__web-analytics-continents-chart","mcp__claude_ai_Ahref__web-analytics-countries","mcp__claude_ai_Ahref__web-analytics-countries-chart","mcp__claude_ai_Ahref__web-analytics-devices","mcp__claude_ai_Ahref__web-analytics-devices-chart","mcp__claude_ai_Ahref__web-analytics-entry-pages","mcp__claude_ai_Ahref__web-analytics-entry-pages-chart","mcp__claude_ai_Ahref__web-analytics-exit-pages","mcp__claude_ai_Ahref__web-analytics-exit-pages-chart","mcp__claude_ai_Ahref__web-analytics-languages","mcp__claude_ai_Ahref__web-analytics-languages-chart","mcp__claude_ai_Ahref__web-analytics-operating-systems","mcp__claude_ai_Ahref__web-analytics-operating-systems-chart","mcp__claude_ai_Ahref__web-analytics-operating-systems-versions","mcp__claude_ai_Ahref__web-analytics-operating-systems-versions-chart","mcp__claude_ai_Ahref__web-analytics-referrers","mcp__claude_ai_Ahref__web-analytics-referrers-chart","mcp__claude_ai_Ahref__web-analytics-source-channels","mcp__claude_ai_Ahref__web-analytics-source-channels-chart","mcp__claude_ai_Ahref__web-analytics-sources","mcp__claude_ai_Ahref__web-analytics-sources-chart","mcp__claude_ai_Ahref__web-analytics-stats","mcp__claude_ai_Ahref__web-analytics-top-pages","mcp__claude_ai_Ahref__web-analytics-top-pages-chart","mcp__claude_ai_Ahref__web-analytics-utm-params","mcp__claude_ai_Ahref__web-analytics-utm-params-chart","mcp__claude_ai_Canva__cancel-editing-transaction","mcp__claude_ai_Canva__comment-on-design","mcp__claude_ai_Canva__commit-editing-transaction","mcp__claude_ai_Canva__copy-design","mcp__claude_ai_Canva__create-brand-template-draft","mcp__claude_ai_Canva__create-design-from-brand-template","mcp__claude_ai_Canva__create-design-from-candidate","mcp__claude_ai_Canva__create-folder","mcp__claude_ai_Canva__export-design","mcp__claude_ai_Canva__generate-design","mcp__claude_ai_Canva__generate-design-structured","mcp__claude_ai_Canva__get-assets","mcp__claude_ai_Canva__get-brand-template-dataset","mcp__claude_ai_Canva__get-design","mcp__claude_ai_Canva__get-design-candidates","mcp__claude_ai_Canva__get-design-content","mcp__claude_ai_Canva__get-design-pages","mcp__claude_ai_Canva__get-design-thumbnail","mcp__claude_ai_Canva__get-export-formats","mcp__claude_ai_Canva__get-presenter-notes","mcp__claude_ai_Canva__help","mcp__claude_ai_Canva__import-design-from-url","mcp__claude_ai_Canva__list-brand-kits","mcp__claude_ai_Canva__list-comments","mcp__claude_ai_Canva__list-folder-items","mcp__claude_ai_Canva__list-replies","mcp__claude_ai_Canva__merge-designs","mcp__claude_ai_Canva__move-item-to-folder","mcp__claude_ai_Canva__perform-editing-operations","mcp__claude_ai_Canva__publish-brand-template","mcp__claude_ai_Canva__reply-to-comment","mcp__claude_ai_Canva__request-outline-review","mcp__claude_ai_Canva__resize-design","mcp__claude_ai_Canva__resolve-shortlink","mcp__claude_ai_Canva__search-brand-templates","mcp__claude_ai_Canva__search-designs","mcp__claude_ai_Canva__search-folders","mcp__claude_ai_Canva__start-editing-transaction","mcp__claude_ai_Canva__upload-asset-from-url","mcp__claude_ai_DATA_GOUV_FR__get_dataservice_info","mcp__claude_ai_DATA_GOUV_FR__get_dataservice_openapi_spec","mcp__claude_ai_DATA_GOUV_FR__get_dataset_info","mcp__claude_ai_DATA_GOUV_FR__get_metrics","mcp__claude_ai_DATA_GOUV_FR__get_resource_info","mcp__claude_ai_DATA_GOUV_FR__list_dataset_resources","mcp__claude_ai_DATA_GOUV_FR__query_resource_data","mcp__claude_ai_DATA_GOUV_FR__search_dataservices","mcp__claude_ai_DATA_GOUV_FR__search_datasets","mcp__claude_ai_DATA_GOUV_FR__search_organizations","mcp__claude_ai_Data_For_SEO__authenticate","mcp__claude_ai_Data_For_SEO__complete_authentication","mcp__claude_ai_Esteworld-Body__add_block","mcp__claude_ai_Esteworld-Body__delete_block","mcp__claude_ai_Esteworld-Body__find_esteworld_page","mcp__claude_ai_Esteworld-Body__fix_global_blocks","mcp__claude_ai_Esteworld-Body__get_block","mcp__claude_ai_Esteworld-Body__get_blocks_library","mcp__claude_ai_Esteworld-Body__get_breadcrumb","mcp__claude_ai_Esteworld-Body__get_fr_en_mapping","mcp__claude_ai_Esteworld-Body__get_internal_links","mcp__claude_ai_Esteworld-Body__get_internal_links_en","mcp__claude_ai_Esteworld-Body__get_maillage_rules","mcp__claude_ai_Esteworld-Body__get_page","mcp__claude_ai_Esteworld-Body__get_page_json","mcp__claude_ai_Esteworld-Body__get_page_status","mcp__claude_ai_Esteworld-Body__get_redirections","mcp__claude_ai_Esteworld-Body__get_section_content","mcp__claude_ai_Esteworld-Body__get_thematique_pages","mcp__claude_ai_Esteworld-Body__get_translation_languages","mcp__claude_ai_Esteworld-Body__list_pages","mcp__claude_ai_Esteworld-Body__list_pages_by_thematique","mcp__claude_ai_Esteworld-Body__list_pages_by_type","mcp__claude_ai_Esteworld-Body__list_pages_to_create","mcp__claude_ai_Esteworld-Body__list_pages_to_rewrite","mcp__claude_ai_Esteworld-Body__list_pages_with_esteworld","mcp__claude_ai_Esteworld-Body__list_pages_without_esteworld","mcp__claude_ai_Esteworld-Body__n8n_activate_workflow","mcp__claude_ai_Esteworld-Body__n8n_get_executions","mcp__claude_ai_Esteworld-Body__n8n_get_workflow","mcp__claude_ai_Esteworld-Body__n8n_list_workflows","mcp__claude_ai_Esteworld-Body__n8n_trigger_webhook","mcp__claude_ai_Esteworld-Body__preview_global_fixes","mcp__claude_ai_Esteworld-Body__reorder_blocks","mcp__claude_ai_Esteworld-Body__search_content","mcp__claude_ai_Esteworld-Body__search_links_by_keyword","mcp__claude_ai_Esteworld-Body__search_links_by_keyword_en","mcp__claude_ai_Esteworld-Body__submit_page","mcp__claude_ai_Esteworld-Body__submit_page_light","mcp__claude_ai_Esteworld-Body__translate_page","mcp__claude_ai_Esteworld-Body__update_block","mcp__claude_ai_Figma__add_code_connect_map","mcp__claude_ai_Figma__create_new_file","mcp__claude_ai_Figma__download_assets","mcp__claude_ai_Figma__generate_diagram","mcp__claude_ai_Figma__get_code_connect_map","mcp__claude_ai_Figma__get_code_connect_suggestions","mcp__claude_ai_Figma__get_context_for_code_connect","mcp__claude_ai_Figma__get_design_context","mcp__claude_ai_Figma__get_figjam","mcp__claude_ai_Figma__get_libraries","mcp__claude_ai_Figma__get_metadata","mcp__claude_ai_Figma__get_screenshot","mcp__claude_ai_Figma__get_variable_defs","mcp__claude_ai_Figma__search_design_system","mcp__claude_ai_Figma__send_code_connect_mappings","mcp__claude_ai_Figma__upload_assets","mcp__claude_ai_Figma__use_figma","mcp__claude_ai_Figma__whoami","mcp__claude_ai_Gmail__create_draft","mcp__claude_ai_Gmail__create_label","mcp__claude_ai_Gmail__delete_label","mcp__claude_ai_Gmail__get_thread","mcp__claude_ai_Gmail__label_message","mcp__claude_ai_Gmail__label_thread","mcp__claude_ai_Gmail__list_drafts","mcp__claude_ai_Gmail__list_labels","mcp__claude_ai_Gmail__search_threads","mcp__claude_ai_Gmail__unlabel_message","mcp__claude_ai_Gmail__unlabel_thread","mcp__claude_ai_Gmail__update_label","mcp__claude_ai_Google_Calendar__create_event","mcp__claude_ai_Google_Calendar__delete_event","mcp__claude_ai_Google_Calendar__get_event","mcp__claude_ai_Google_Calendar__list_calendars","mcp__claude_ai_Google_Calendar__list_events","mcp__claude_ai_Google_Calendar__respond_to_event","mcp__claude_ai_Google_Calendar__suggest_time","mcp__claude_ai_Google_Calendar__update_event","mcp__claude_ai_Google_Drive__copy_file","mcp__claude_ai_Google_Drive__create_file","mcp__claude_ai_Google_Drive__download_file_content","mcp__claude_ai_Google_Drive__get_file_metadata","mcp__claude_ai_Google_Drive__get_file_permissions","mcp__claude_ai_Google_Drive__list_recent_files","mcp__claude_ai_Google_Drive__read_file_content","mcp__claude_ai_Google_Drive__search_files","mcp__claude_ai_SEMRush__backlink_research","mcp__claude_ai_SEMRush__execute_report","mcp__claude_ai_SEMRush__get_report_schema","mcp__claude_ai_SEMRush__keyword_research","mcp__claude_ai_SEMRush__organic_research","mcp__claude_ai_SEMRush__overview_research","mcp__claude_ai_SEMRush__projects_research","mcp__claude_ai_SEMRush__siteaudit_research","mcp__claude_ai_SEMRush__subdomain_research","mcp__claude_ai_SEMRush__subfolder_research","mcp__claude_ai_SEMRush__tracking_research","mcp__claude_ai_SEMRush__trends_research","mcp__claude_ai_SEMRush__url_research","mcp__claude_ai_Vercel__add_toolbar_reaction","mcp__claude_ai_Vercel__change_toolbar_thread_resolve_status","mcp__claude_ai_Vercel__check_domain_availability_and_price","mcp__claude_ai_Vercel__deploy_to_vercel","mcp__claude_ai_Vercel__edit_toolbar_message","mcp__claude_ai_Vercel__get_access_to_vercel_url","mcp__claude_ai_Vercel__get_deployment","mcp__claude_ai_Vercel__get_deployment_build_logs","mcp__claude_ai_Vercel__get_project","mcp__claude_ai_Vercel__get_runtime_logs","mcp__claude_ai_Vercel__get_toolbar_thread","mcp__claude_ai_Vercel__import-claude-design-from-url","mcp__claude_ai_Vercel__list_deployments","mcp__claude_ai_Vercel__list_projects","mcp__claude_ai_Vercel__list_teams","mcp__claude_ai_Vercel__list_toolbar_threads","mcp__claude_ai_Vercel__reply_to_toolbar_thread","mcp__claude_ai_Vercel__search_vercel_documentation","mcp__claude_ai_Vercel__web_fetch_vercel_url","mcp__gpt-image-2__continue_edit_session","mcp__gpt-image-2__edit_image","mcp__gpt-image-2__end_edit_session","mcp__gpt-image-2__generate_image","mcp__gpt-image-2__list_edit_sessions","mcp__gpt-image-2__start_edit_session","mcp__hostinger__DNS_deleteDNSRecordsV1","mcp__hostinger__DNS_getDNSRecordsV1","mcp__hostinger__DNS_getDNSSnapshotListV1","mcp__hostinger__DNS_getDNSSnapshotV1","mcp__hostinger__DNS_resetDNSRecordsV1","mcp__hostinger__DNS_restoreDNSSnapshotV1","mcp__hostinger__DNS_updateDNSRecordsV1","mcp__hostinger__DNS_validateDNSRecordsV1","mcp__hostinger__VPS_activateFirewallV1","mcp__hostinger__VPS_attachPublicKeyV1","mcp__hostinger__VPS_createFirewallRuleV1","mcp__hostinger__VPS_createNewFirewallV1","mcp__hostinger__VPS_createNewProjectV1","mcp__hostinger__VPS_createPTRRecordV1","mcp__hostinger__VPS_createPostInstallScriptV1","mcp__hostinger__VPS_createPublicKeyV1","mcp__hostinger__VPS_createSnapshotV1","mcp__hostinger__VPS_deactivateFirewallV1","mcp__hostinger__VPS_deleteFirewallRuleV1","mcp__hostinger__VPS_deleteFirewallV1","mcp__hostinger__VPS_deletePTRRecordV1","mcp__hostinger__VPS_deletePostInstallScriptV1","mcp__hostinger__VPS_deleteProjectV1","mcp__hostinger__VPS_deletePublicKeyV1","mcp__hostinger__VPS_deleteSnapshotV1","mcp__hostinger__VPS_getActionDetailsV1","mcp__hostinger__VPS_getActionsV1","mcp__hostinger__VPS_getAttachedPublicKeysV1","mcp__hostinger__VPS_getBackupsV1","mcp__hostinger__VPS_getDataCenterListV1","mcp__hostinger__VPS_getFirewallDetailsV1","mcp__hostinger__VPS_getFirewallListV1","mcp__hostinger__VPS_getMetricsV1","mcp__hostinger__VPS_getPostInstallScriptV1","mcp__hostinger__VPS_getPostInstallScriptsV1","mcp__hostinger__VPS_getProjectContainersV1","mcp__hostinger__VPS_getProjectContentsV1","mcp__hostinger__VPS_getProjectListV1","mcp__hostinger__VPS_getProjectLogsV1","mcp__hostinger__VPS_getPublicKeysV1","mcp__hostinger__VPS_getScanMetricsV1","mcp__hostinger__VPS_getSnapshotV1","mcp__hostinger__VPS_getTemplateDetailsV1","mcp__hostinger__VPS_getTemplatesV1","mcp__hostinger__VPS_getVirtualMachineDetailsV1","mcp__hostinger__VPS_getVirtualMachinesV1","mcp__hostinger__VPS_installMonarxV1","mcp__hostinger__VPS_purchaseNewVirtualMachineV1","mcp__hostinger__VPS_recreateVirtualMachineV1","mcp__hostinger__VPS_resetHostnameV1","mcp__hostinger__VPS_restartProjectV1","mcp__hostinger__VPS_restartVirtualMachineV1","mcp__hostinger__VPS_restoreBackupV1","mcp__hostinger__VPS_restoreSnapshotV1","mcp__hostinger__VPS_setHostnameV1","mcp__hostinger__VPS_setNameserversV1","mcp__hostinger__VPS_setPanelPasswordV1","mcp__hostinger__VPS_setRootPasswordV1","mcp__hostinger__VPS_setupPurchasedVirtualMachineV1","mcp__hostinger__VPS_startProjectV1","mcp__hostinger__VPS_startRecoveryModeV1","mcp__hostinger__VPS_startVirtualMachineV1","mcp__hostinger__VPS_stopProjectV1","mcp__hostinger__VPS_stopRecoveryModeV1","mcp__hostinger__VPS_stopVirtualMachineV1","mcp__hostinger__VPS_syncFirewallV1","mcp__hostinger__VPS_uninstallMonarxV1","mcp__hostinger__VPS_updateFirewallRuleV1","mcp__hostinger__VPS_updatePostInstallScriptV1","mcp__hostinger__VPS_updateProjectV1","mcp__hostinger__billing_deletePaymentMethodV1","mcp__hostinger__billing_disableAutoRenewalV1","mcp__hostinger__billing_enableAutoRenewalV1","mcp__hostinger__billing_getCatalogItemListV1","mcp__hostinger__billing_getPaymentMethodListV1","mcp__hostinger__billing_getSubscriptionListV1","mcp__hostinger__billing_setDefaultPaymentMethodV1","mcp__hostinger__domains_checkDomainAvailabilityV1","mcp__hostinger__domains_createDomainForwardingV1","mcp__hostinger__domains_createWHOISProfileV1","mcp__hostinger__domains_deleteDomainForwardingV1","mcp__hostinger__domains_deleteWHOISProfileV1","mcp__hostinger__domains_disableDomainLockV1","mcp__hostinger__domains_disablePrivacyProtectionV1","mcp__hostinger__domains_enableDomainLockV1","mcp__hostinger__domains_enablePrivacyProtectionV1","mcp__hostinger__domains_getDomainDetailsV1","mcp__hostinger__domains_getDomainForwardingV1","mcp__hostinger__domains_getDomainListV1","mcp__hostinger__domains_getWHOISProfileListV1","mcp__hostinger__domains_getWHOISProfileUsageV1","mcp__hostinger__domains_getWHOISProfileV1","mcp__hostinger__domains_purchaseNewDomainV1","mcp__hostinger__domains_updateDomainNameserversV1","mcp__hostinger__hosting_createAccountDatabaseV1","mcp__hostinger__hosting_createWebsiteParkedDomainV1","mcp__hostinger__hosting_createWebsiteSubdomainV1","mcp__hostinger__hosting_createWebsiteV1","mcp__hostinger__hosting_deleteAccountDatabaseV1","mcp__hostinger__hosting_deleteWebsiteParkedDomainV1","mcp__hostinger__hosting_deleteWebsiteSubdomainV1","mcp__hostinger__hosting_deployJsApplication","mcp__hostinger__hosting_deployStaticWebsite","mcp__hostinger__hosting_deployWordpressPlugin","mcp__hostinger__hosting_deployWordpressTheme","mcp__hostinger__hosting_generateAFreeSubdomainV1","mcp__hostinger__hosting_importWordpressWebsite","mcp__hostinger__hosting_installWordPressV1","mcp__hostinger__hosting_listAccountDatabasesV1","mcp__hostinger__hosting_listAvailableDatacentersV1","mcp__hostinger__hosting_listJsDeployments","mcp__hostinger__hosting_listOrdersV1","mcp__hostinger__hosting_listWebsiteParkedDomainsV1","mcp__hostinger__hosting_listWebsiteSubdomainsV1","mcp__hostinger__hosting_listWebsitesV1","mcp__hostinger__hosting_listWordPressInstallationsV1","mcp__hostinger__hosting_showJsDeploymentLogs","mcp__hostinger__hosting_verifyDomainOwnershipV1","mcp__hostinger__reach_createANewContactSegmentV1","mcp__hostinger__reach_createANewContactV1","mcp__hostinger__reach_createNewContactsV1","mcp__hostinger__reach_deleteAContactV1","mcp__hostinger__reach_getSegmentDetailsV1","mcp__hostinger__reach_listContactGroupsV1","mcp__hostinger__reach_listContactsV1","mcp__hostinger__reach_listProfilesV1","mcp__hostinger__reach_listSegmentContactsV1","mcp__hostinger__reach_listSegmentsV1","mcp__hostinger__v2_getDomainVerificationsDIRECT","mcp__n8n-mcp__get_node","mcp__n8n-mcp__get_template","mcp__n8n-mcp__n8n_audit_instance","mcp__n8n-mcp__n8n_autofix_workflow","mcp__n8n-mcp__n8n_create_workflow","mcp__n8n-mcp__n8n_delete_workflow","mcp__n8n-mcp__n8n_deploy_template","mcp__n8n-mcp__n8n_executions","mcp__n8n-mcp__n8n_generate_workflow","mcp__n8n-mcp__n8n_get_workflow","mcp__n8n-mcp__n8n_health_check","mcp__n8n-mcp__n8n_list_workflows","mcp__n8n-mcp__n8n_manage_credentials","mcp__n8n-mcp__n8n_manage_datatable","mcp__n8n-mcp__n8n_test_workflow","mcp__n8n-mcp__n8n_update_full_workflow","mcp__n8n-mcp__n8n_update_partial_workflow","mcp__n8n-mcp__n8n_validate_workflow","mcp__n8n-mcp__n8n_workflow_versions","mcp__n8n-mcp__search_nodes","mcp__n8n-mcp__search_templates","mcp__n8n-mcp__tools_documentation","mcp__n8n-mcp__validate_node","mcp__n8n-mcp__validate_workflow","mcp__nanobanana__generate_image","mcp__nanobanana__maintenance","mcp__nanobanana__show_output_stats","mcp__nanobanana__upload_file","mcp__plugin_vercel_vercel__authenticate","mcp__plugin_vercel_vercel__complete_authentication","mcp__refero__refero_get_flow","mcp__refero__refero_get_screen","mcp__refero__refero_get_screen_image","mcp__refero__refero_get_similar_screens","mcp__refero__refero_get_style","mcp__refero__refero_search_flows","mcp__refero__refero_search_screens","mcp__refero__refero_search_styles","mcp__semrush__authenticate","mcp__semrush__complete_authentication","mcp__stock-images-mcp__search_stock_images","mcp__trello__add_card_to_list","mcp__trello__add_checklist_item","mcp__trello__add_comment","mcp__trello__add_list_to_board","mcp__trello__archive_card","mcp__trello__archive_list","mcp__trello__assign_member_to_card","mcp__trello__attach_file_to_card","mcp__trello__attach_image_data_to_card","mcp__trello__attach_image_to_card","mcp__trello__create_board","mcp__trello__create_checklist","mcp__trello__create_label","mcp__trello__delete_comment","mcp__trello__delete_label","mcp__trello__find_checklist_items_by_description","mcp__trello__get_acceptance_criteria","mcp__trello__get_active_board_info","mcp__trello__get_board_labels","mcp__trello__get_board_members","mcp__trello__get_card","mcp__trello__get_card_comments","mcp__trello__get_card_history","mcp__trello__get_cards_by_list_id","mcp__trello__get_checklist_by_name","mcp__trello__get_checklist_items","mcp__trello__get_health","mcp__trello__get_health_detailed","mcp__trello__get_health_metadata","mcp__trello__get_health_performance","mcp__trello__get_lists","mcp__trello__get_my_cards","mcp__trello__get_recent_activity","mcp__trello__list_boards","mcp__trello__list_boards_in_workspace","mcp__trello__list_workspaces","mcp__trello__move_card","mcp__trello__perform_system_repair","mcp__trello__remove_member_from_card","mcp__trello__set_active_board","mcp__trello__set_active_workspace","mcp__trello__update_card_details","mcp__trello__update_checklist_item","mcp__trello__update_comment","mcp__trello__update_label"],"addedLines":["CronCreate","CronDelete","CronList","DesignSync","EnterWorktree","ExitWorktree","ListMcpResourcesTool","Monitor","NotebookEdit","PushNotification","ReadMcpResourceTool","RemoteTrigger","TaskCreate","TaskGet","TaskList","TaskStop","TaskUpdate","WebFetch","WebSearch","mcp__EstimanouContent__add_article_block","mcp__EstimanouContent__add_block","mcp__EstimanouContent__create_article","mcp__EstimanouContent__create_page","mcp__EstimanouContent__delete_article","mcp__EstimanouContent__delete_article_block","mcp__EstimanouContent__delete_block","mcp__EstimanouContent__get_article","mcp__EstimanouContent__get_city_page","mcp__EstimanouContent__get_page","mcp__EstimanouContent__list_articles","mcp__EstimanouContent__list_available_blocks","mcp__EstimanouContent__list_city_pages","mcp__EstimanouContent__list_pages","mcp__EstimanouContent__list_site_urls","mcp__EstimanouContent__reorder_article_blocks","mcp__EstimanouContent__reorder_blocks","mcp__EstimanouContent__replace_article_content","mcp__EstimanouContent__replace_city_seo_content","mcp__EstimanouContent__replace_page_layout","mcp__EstimanouContent__search_internal_links","mcp__EstimanouContent__update_article","mcp__EstimanouContent__update_article_block","mcp__EstimanouContent__update_block","mcp__EstimanouContent__update_city_page_content","mcp__claude_ai_Ahref__batch-analysis","mcp__claude_ai_Ahref__brand-radar-ai-responses","mcp__claude_ai_Ahref__brand-radar-ai-responses-entities","mcp__claude_ai_Ahref__brand-radar-cited-domains","mcp__claude_ai_Ahref__brand-radar-cited-domains-entities","mcp__claude_ai_Ahref__brand-radar-cited-pages","mcp__claude_ai_Ahref__brand-radar-cited-pages-entities","mcp__claude_ai_Ahref__brand-radar-impressions-history","mcp__claude_ai_Ahref__brand-radar-impressions-overview","mcp__claude_ai_Ahref__brand-radar-impressions-overview-entities","mcp__claude_ai_Ahref__brand-radar-mentions-history","mcp__claude_ai_Ahref__brand-radar-mentions-history-entities","mcp__claude_ai_Ahref__brand-radar-mentions-overview","mcp__claude_ai_Ahref__brand-radar-mentions-overview-entities","mcp__claude_ai_Ahref__brand-radar-sov-history","mcp__claude_ai_Ahref__brand-radar-sov-history-entities","mcp__claude_ai_Ahref__brand-radar-sov-overview","mcp__claude_ai_Ahref__brand-radar-sov-overview-entities","mcp__claude_ai_Ahref__doc","mcp__claude_ai_Ahref__gsc-anonymous-queries","mcp__claude_ai_Ahref__gsc-ctr-by-position","mcp__claude_ai_Ahref__gsc-keyword-history","mcp__claude_ai_Ahref__gsc-keywords","mcp__claude_ai_Ahref__gsc-metrics-by-country","mcp__claude_ai_Ahref__gsc-page-history","mcp__claude_ai_Ahref__gsc-pages","mcp__claude_ai_Ahref__gsc-pages-history","mcp__claude_ai_Ahref__gsc-performance-by-device","mcp__claude_ai_Ahref__gsc-performance-by-position","mcp__claude_ai_Ahref__gsc-performance-history","mcp__claude_ai_Ahref__gsc-positions-history","mcp__claude_ai_Ahref__keywords-explorer-matching-terms","mcp__claude_ai_Ahref__keywords-explorer-overview","mcp__claude_ai_Ahref__keywords-explorer-related-terms","mcp__claude_ai_Ahref__keywords-explorer-search-suggestions","mcp__claude_ai_Ahref__keywords-explorer-volume-by-country","mcp__claude_ai_Ahref__keywords-explorer-volume-history","mcp__claude_ai_Ahref__management-brand-radar-prompts","mcp__claude_ai_Ahref__management-brand-radar-reports","mcp__claude_ai_Ahref__management-keyword-list-keywords","mcp__claude_ai_Ahref__management-locations","mcp__claude_ai_Ahref__management-project-competitors","mcp__claude_ai_Ahref__management-project-keywords","mcp__claude_ai_Ahref__management-projects","mcp__claude_ai_Ahref__public-crawler-ip-ranges","mcp__claude_ai_Ahref__public-crawler-ips","mcp__claude_ai_Ahref__public-domain-rating-free","mcp__claude_ai_Ahref__rank-tracker-competitors-domains","mcp__claude_ai_Ahref__rank-tracker-competitors-overview","mcp__claude_ai_Ahref__rank-tracker-competitors-pages","mcp__claude_ai_Ahref__rank-tracker-competitors-stats","mcp__claude_ai_Ahref__rank-tracker-overview","mcp__claude_ai_Ahref__rank-tracker-serp-overview","mcp__claude_ai_Ahref__render-data-table","mcp__claude_ai_Ahref__render-scorecard","mcp__claude_ai_Ahref__render-time-series-chart","mcp__claude_ai_Ahref__serp-overview","mcp__claude_ai_Ahref__site-audit-issues","mcp__claude_ai_Ahref__site-audit-page-content","mcp__claude_ai_Ahref__site-audit-page-explorer","mcp__claude_ai_Ahref__site-audit-projects","mcp__claude_ai_Ahref__site-explorer-all-backlinks","mcp__claude_ai_Ahref__site-explorer-anchors","mcp__claude_ai_Ahref__site-explorer-backlinks-stats","mcp__claude_ai_Ahref__site-explorer-broken-backlinks","mcp__claude_ai_Ahref__site-explorer-crawled-pages","mcp__claude_ai_Ahref__site-explorer-domain-rating","mcp__claude_ai_Ahref__site-explorer-domain-rating-history","mcp__claude_ai_Ahref__site-explorer-keywords-history","mcp__claude_ai_Ahref__site-explorer-linked-anchors-external","mcp__claude_ai_Ahref__site-explorer-linked-anchors-internal","mcp__claude_ai_Ahref__site-explorer-linked-domains","mcp__claude_ai_Ahref__site-explorer-metrics","mcp__claude_ai_Ahref__site-explorer-metrics-by-country","mcp__claude_ai_Ahref__site-explorer-metrics-history","mcp__claude_ai_Ahref__site-explorer-organic-competitors","mcp__claude_ai_Ahref__site-explorer-organic-keywords","mcp__claude_ai_Ahref__site-explorer-outlinks-stats","mcp__claude_ai_Ahref__site-explorer-pages-by-backlinks","mcp__claude_ai_Ahref__site-explorer-pages-by-internal-links","mcp__claude_ai_Ahref__site-explorer-pages-by-traffic","mcp__claude_ai_Ahref__site-explorer-pages-history","mcp__claude_ai_Ahref__site-explorer-paid-pages","mcp__claude_ai_Ahref__site-explorer-refdomains-history","mcp__claude_ai_Ahref__site-explorer-referring-domains","mcp__claude_ai_Ahref__site-explorer-top-pages","mcp__claude_ai_Ahref__site-explorer-total-search-volume-history","mcp__claude_ai_Ahref__site-explorer-url-rating-history","mcp__claude_ai_Ahref__social-media-activity-history","mcp__claude_ai_Ahref__social-media-authors","mcp__claude_ai_Ahref__social-media-channel-metrics","mcp__claude_ai_Ahref__social-media-channels","mcp__claude_ai_Ahref__social-media-post-metrics","mcp__claude_ai_Ahref__social-media-posts","mcp__claude_ai_Ahref__subscription-info-limits-and-usage","mcp__claude_ai_Ahref__web-analytics-browser-versions","mcp__claude_ai_Ahref__web-analytics-browser-versions-chart","mcp__claude_ai_Ahref__web-analytics-browsers","mcp__claude_ai_Ahref__web-analytics-browsers-chart","mcp__claude_ai_Ahref__web-analytics-chart","mcp__claude_ai_Ahref__web-analytics-cities","mcp__claude_ai_Ahref__web-analytics-cities-chart","mcp__claude_ai_Ahref__web-analytics-continents","mcp__claude_ai_Ahref__web-analytics-continents-chart","mcp__claude_ai_Ahref__web-analytics-countries","mcp__claude_ai_Ahref__web-analytics-countries-chart","mcp__claude_ai_Ahref__web-analytics-devices","mcp__claude_ai_Ahref__web-analytics-devices-chart","mcp__claude_ai_Ahref__web-analytics-entry-pages","mcp__claude_ai_Ahref__web-analytics-entry-pages-chart","mcp__claude_ai_Ahref__web-analytics-exit-pages","mcp__claude_ai_Ahref__web-analytics-exit-pages-chart","mcp__claude_ai_Ahref__web-analytics-languages","mcp__claude_ai_Ahref__web-analytics-languages-chart","mcp__claude_ai_Ahref__web-analytics-operating-systems","mcp__claude_ai_Ahref__web-analytics-operating-systems-chart","mcp__claude_ai_Ahref__web-analytics-operating-systems-versions","mcp__claude_ai_Ahref__web-analytics-operating-systems-versions-chart","mcp__claude_ai_Ahref__web-analytics-referrers","mcp__claude_ai_Ahref__web-analytics-referrers-chart","mcp__claude_ai_Ahref__web-analytics-source-channels","mcp__claude_ai_Ahref__web-analytics-source-channels-chart","mcp__claude_ai_Ahref__web-analytics-sources","mcp__claude_ai_Ahref__web-analytics-sources-chart","mcp__claude_ai_Ahref__web-analytics-stats","mcp__claude_ai_Ahref__web-analytics-top-pages","mcp__claude_ai_Ahref__web-analytics-top-pages-chart","mcp__claude_ai_Ahref__web-analytics-utm-params","mcp__claude_ai_Ahref__web-analytics-utm-params-chart","mcp__claude_ai_Canva__cancel-editing-transaction","mcp__claude_ai_Canva__comment-on-design","mcp__claude_ai_Canva__commit-editing-transaction","mcp__claude_ai_Canva__copy-design","mcp__claude_ai_Canva__create-brand-template-draft","mcp__claude_ai_Canva__create-design-from-brand-template","mcp__claude_ai_Canva__create-design-from-candidate","mcp__claude_ai_Canva__create-folder","mcp__claude_ai_Canva__export-design","mcp__claude_ai_Canva__generate-design","mcp__claude_ai_Canva__generate-design-structured","mcp__claude_ai_Canva__get-assets","mcp__claude_ai_Canva__get-brand-template-dataset","mcp__claude_ai_Canva__get-design","mcp__claude_ai_Canva__get-design-candidates","mcp__claude_ai_Canva__get-design-content","mcp__claude_ai_Canva__get-design-pages","mcp__claude_ai_Canva__get-design-thumbnail","mcp__claude_ai_Canva__get-export-formats","mcp__claude_ai_Canva__get-presenter-notes","mcp__claude_ai_Canva__help","mcp__claude_ai_Canva__import-design-from-url","mcp__claude_ai_Canva__list-brand-kits","mcp__claude_ai_Canva__list-comments","mcp__claude_ai_Canva__list-folder-items","mcp__claude_ai_Canva__list-replies","mcp__claude_ai_Canva__merge-designs","mcp__claude_ai_Canva__move-item-to-folder","mcp__claude_ai_Canva__perform-editing-operations","mcp__claude_ai_Canva__publish-brand-template","mcp__claude_ai_Canva__reply-to-comment","mcp__claude_ai_Canva__request-outline-review","mcp__claude_ai_Canva__resize-design","mcp__claude_ai_Canva__resolve-shortlink","mcp__claude_ai_Canva__search-brand-templates","mcp__claude_ai_Canva__search-designs","mcp__claude_ai_Canva__search-folders","mcp__claude_ai_Canva__start-editing-transaction","mcp__claude_ai_Canva__upload-asset-from-url","mcp__claude_ai_DATA_GOUV_FR__get_dataservice_info","mcp__claude_ai_DATA_GOUV_FR__get_dataservice_openapi_spec","mcp__claude_ai_DATA_GOUV_FR__get_dataset_info","mcp__claude_ai_DATA_GOUV_FR__get_metrics","mcp__claude_ai_DATA_GOUV_FR__get_resource_info","mcp__claude_ai_DATA_GOUV_FR__list_dataset_resources","mcp__claude_ai_DATA_GOUV_FR__query_resource_data","mcp__claude_ai_DATA_GOUV_FR__search_dataservices","mcp__claude_ai_DATA_GOUV_FR__search_datasets","mcp__claude_ai_DATA_GOUV_FR__search_organizations","mcp__claude_ai_Data_For_SEO__authenticate","mcp__claude_ai_Data_For_SEO__complete_authentication","mcp__claude_ai_Esteworld-Body__add_block","mcp__claude_ai_Esteworld-Body__delete_block","mcp__claude_ai_Esteworld-Body__find_esteworld_page","mcp__claude_ai_Esteworld-Body__fix_global_blocks","mcp__claude_ai_Esteworld-Body__get_block","mcp__claude_ai_Esteworld-Body__get_blocks_library","mcp__claude_ai_Esteworld-Body__get_breadcrumb","mcp__claude_ai_Esteworld-Body__get_fr_en_mapping","mcp__claude_ai_Esteworld-Body__get_internal_links","mcp__claude_ai_Esteworld-Body__get_internal_links_en","mcp__claude_ai_Esteworld-Body__get_maillage_rules","mcp__claude_ai_Esteworld-Body__get_page","mcp__claude_ai_Esteworld-Body__get_page_json","mcp__claude_ai_Esteworld-Body__get_page_status","mcp__claude_ai_Esteworld-Body__get_redirections","mcp__claude_ai_Esteworld-Body__get_section_content","mcp__claude_ai_Esteworld-Body__get_thematique_pages","mcp__claude_ai_Esteworld-Body__get_translation_languages","mcp__claude_ai_Esteworld-Body__list_pages","mcp__claude_ai_Esteworld-Body__list_pages_by_thematique","mcp__claude_ai_Esteworld-Body__list_pages_by_type","mcp__claude_ai_Esteworld-Body__list_pages_to_create","mcp__claude_ai_Esteworld-Body__list_pages_to_rewrite","mcp__claude_ai_Esteworld-Body__list_pages_with_esteworld","mcp__claude_ai_Esteworld-Body__list_pages_without_esteworld","mcp__claude_ai_Esteworld-Body__n8n_activate_workflow","mcp__claude_ai_Esteworld-Body__n8n_get_executions","mcp__claude_ai_Esteworld-Body__n8n_get_workflow","mcp__claude_ai_Esteworld-Body__n8n_list_workflows","mcp__claude_ai_Esteworld-Body__n8n_trigger_webhook","mcp__claude_ai_Esteworld-Body__preview_global_fixes","mcp__claude_ai_Esteworld-Body__reorder_blocks","mcp__claude_ai_Esteworld-Body__search_content","mcp__claude_ai_Esteworld-Body__search_links_by_keyword","mcp__claude_ai_Esteworld-Body__search_links_by_keyword_en","mcp__claude_ai_Esteworld-Body__submit_page","mcp__claude_ai_Esteworld-Body__submit_page_light","mcp__claude_ai_Esteworld-Body__translate_page","mcp__claude_ai_Esteworld-Body__update_block","mcp__claude_ai_Figma__add_code_connect_map","mcp__claude_ai_Figma__create_new_file","mcp__claude_ai_Figma__download_assets","mcp__claude_ai_Figma__generate_diagram","mcp__claude_ai_Figma__get_code_connect_map","mcp__claude_ai_Figma__get_code_connect_suggestions","mcp__claude_ai_Figma__get_context_for_code_connect","mcp__claude_ai_Figma__get_design_context","mcp__claude_ai_Figma__get_figjam","mcp__claude_ai_Figma__get_libraries","mcp__claude_ai_Figma__get_metadata","mcp__claude_ai_Figma__get_screenshot","mcp__claude_ai_Figma__get_variable_defs","mcp__claude_ai_Figma__search_design_system","mcp__claude_ai_Figma__send_code_connect_mappings","mcp__claude_ai_Figma__upload_assets","mcp__claude_ai_Figma__use_figma","mcp__claude_ai_Figma__whoami","mcp__claude_ai_Gmail__create_draft","mcp__claude_ai_Gmail__create_label","mcp__claude_ai_Gmail__delete_label","mcp__claude_ai_Gmail__get_thread","mcp__claude_ai_Gmail__label_message","mcp__claude_ai_Gmail__label_thread","mcp__claude_ai_Gmail__list_drafts","mcp__claude_ai_Gmail__list_labels","mcp__claude_ai_Gmail__search_threads","mcp__claude_ai_Gmail__unlabel_message","mcp__claude_ai_Gmail__unlabel_thread","mcp__claude_ai_Gmail__update_label","mcp__claude_ai_Google_Calendar__create_event","mcp__claude_ai_Google_Calendar__delete_event","mcp__claude_ai_Google_Calendar__get_event","mcp__claude_ai_Google_Calendar__list_calendars","mcp__claude_ai_Google_Calendar__list_events","mcp__claude_ai_Google_Calendar__respond_to_event","mcp__claude_ai_Google_Calendar__suggest_time","mcp__claude_ai_Google_Calendar__update_event","mcp__claude_ai_Google_Drive__copy_file","mcp__claude_ai_Google_Drive__create_file","mcp__claude_ai_Google_Drive__download_file_content","mcp__claude_ai_Google_Drive__get_file_metadata","mcp__claude_ai_Google_Drive__get_file_permissions","mcp__claude_ai_Google_Drive__list_recent_files","mcp__claude_ai_Google_Drive__read_file_content","mcp__claude_ai_Google_Drive__search_files","mcp__claude_ai_SEMRush__backlink_research","mcp__claude_ai_SEMRush__execute_report","mcp__claude_ai_SEMRush__get_report_schema","mcp__claude_ai_SEMRush__keyword_research","mcp__claude_ai_SEMRush__organic_research","mcp__claude_ai_SEMRush__overview_research","mcp__claude_ai_SEMRush__projects_research","mcp__claude_ai_SEMRush__siteaudit_research","mcp__claude_ai_SEMRush__subdomain_research","mcp__claude_ai_SEMRush__subfolder_research","mcp__claude_ai_SEMRush__tracking_research","mcp__claude_ai_SEMRush__trends_research","mcp__claude_ai_SEMRush__url_research","mcp__claude_ai_Vercel__add_toolbar_reaction","mcp__claude_ai_Vercel__change_toolbar_thread_resolve_status","mcp__claude_ai_Vercel__check_domain_availability_and_price","mcp__claude_ai_Vercel__deploy_to_vercel","mcp__claude_ai_Vercel__edit_toolbar_message","mcp__claude_ai_Vercel__get_access_to_vercel_url","mcp__claude_ai_Vercel__get_deployment","mcp__claude_ai_Vercel__get_deployment_build_logs","mcp__claude_ai_Vercel__get_project","mcp__claude_ai_Vercel__get_runtime_logs","mcp__claude_ai_Vercel__get_toolbar_thread","mcp__claude_ai_Vercel__import-claude-design-from-url","mcp__claude_ai_Vercel__list_deployments","mcp__claude_ai_Vercel__list_projects","mcp__claude_ai_Vercel__list_teams","mcp__claude_ai_Vercel__list_toolbar_threads","mcp__claude_ai_Vercel__reply_to_toolbar_thread","mcp__claude_ai_Vercel__search_vercel_documentation","mcp__claude_ai_Vercel__web_fetch_vercel_url","mcp__gpt-image-2__continue_edit_session","mcp__gpt-image-2__edit_image","mcp__gpt-image-2__end_edit_session","mcp__gpt-image-2__generate_image","mcp__gpt-image-2__list_edit_sessions","mcp__gpt-image-2__start_edit_session","mcp__hostinger__DNS_deleteDNSRecordsV1","mcp__hostinger__DNS_getDNSRecordsV1","mcp__hostinger__DNS_getDNSSnapshotListV1","mcp__hostinger__DNS_getDNSSnapshotV1","mcp__hostinger__DNS_resetDNSRecordsV1","mcp__hostinger__DNS_restoreDNSSnapshotV1","mcp__hostinger__DNS_updateDNSRecordsV1","mcp__hostinger__DNS_validateDNSRecordsV1","mcp__hostinger__VPS_activateFirewallV1","mcp__hostinger__VPS_attachPublicKeyV1","mcp__hostinger__VPS_createFirewallRuleV1","mcp__hostinger__VPS_createNewFirewallV1","mcp__hostinger__VPS_createNewProjectV1","mcp__hostinger__VPS_createPTRRecordV1","mcp__hostinger__VPS_createPostInstallScriptV1","mcp__hostinger__VPS_createPublicKeyV1","mcp__hostinger__VPS_createSnapshotV1","mcp__hostinger__VPS_deactivateFirewallV1","mcp__hostinger__VPS_deleteFirewallRuleV1","mcp__hostinger__VPS_deleteFirewallV1","mcp__hostinger__VPS_deletePTRRecordV1","mcp__hostinger__VPS_deletePostInstallScriptV1","mcp__hostinger__VPS_deleteProjectV1","mcp__hostinger__VPS_deletePublicKeyV1","mcp__hostinger__VPS_deleteSnapshotV1","mcp__hostinger__VPS_getActionDetailsV1","mcp__hostinger__VPS_getActionsV1","mcp__hostinger__VPS_getAttachedPublicKeysV1","mcp__hostinger__VPS_getBackupsV1","mcp__hostinger__VPS_getDataCenterListV1","mcp__hostinger__VPS_getFirewallDetailsV1","mcp__hostinger__VPS_getFirewallListV1","mcp__hostinger__VPS_getMetricsV1","mcp__hostinger__VPS_getPostInstallScriptV1","mcp__hostinger__VPS_getPostInstallScriptsV1","mcp__hostinger__VPS_getProjectContainersV1","mcp__hostinger__VPS_getProjectContentsV1","mcp__hostinger__VPS_getProjectListV1","mcp__hostinger__VPS_getProjectLogsV1","mcp__hostinger__VPS_getPublicKeysV1","mcp__hostinger__VPS_getScanMetricsV1","mcp__hostinger__VPS_getSnapshotV1","mcp__hostinger__VPS_getTemplateDetailsV1","mcp__hostinger__VPS_getTemplatesV1","mcp__hostinger__VPS_getVirtualMachineDetailsV1","mcp__hostinger__VPS_getVirtualMachinesV1","mcp__hostinger__VPS_installMonarxV1","mcp__hostinger__VPS_purchaseNewVirtualMachineV1","mcp__hostinger__VPS_recreateVirtualMachineV1","mcp__hostinger__VPS_resetHostnameV1","mcp__hostinger__VPS_restartProjectV1","mcp__hostinger__VPS_restartVirtualMachineV1","mcp__hostinger__VPS_restoreBackupV1","mcp__hostinger__VPS_restoreSnapshotV1","mcp__hostinger__VPS_setHostnameV1","mcp__hostinger__VPS_setNameserversV1","mcp__hostinger__VPS_setPanelPasswordV1","mcp__hostinger__VPS_setRootPasswordV1","mcp__hostinger__VPS_setupPurchasedVirtualMachineV1","mcp__hostinger__VPS_startProjectV1","mcp__hostinger__VPS_startRecoveryModeV1","mcp__hostinger__VPS_startVirtualMachineV1","mcp__hostinger__VPS_stopProjectV1","mcp__hostinger__VPS_stopRecoveryModeV1","mcp__hostinger__VPS_stopVirtualMachineV1","mcp__hostinger__VPS_syncFirewallV1","mcp__hostinger__VPS_uninstallMonarxV1","mcp__hostinger__VPS_updateFirewallRuleV1","mcp__hostinger__VPS_updatePostInstallScriptV1","mcp__hostinger__VPS_updateProjectV1","mcp__hostinger__billing_deletePaymentMethodV1","mcp__hostinger__billing_disableAutoRenewalV1","mcp__hostinger__billing_enableAutoRenewalV1","mcp__hostinger__billing_getCatalogItemListV1","mcp__hostinger__billing_getPaymentMethodListV1","mcp__hostinger__billing_getSubscriptionListV1","mcp__hostinger__billing_setDefaultPaymentMethodV1","mcp__hostinger__domains_checkDomainAvailabilityV1","mcp__hostinger__domains_createDomainForwardingV1","mcp__hostinger__domains_createWHOISProfileV1","mcp__hostinger__domains_deleteDomainForwardingV1","mcp__hostinger__domains_deleteWHOISProfileV1","mcp__hostinger__domains_disableDomainLockV1","mcp__hostinger__domains_disablePrivacyProtectionV1","mcp__hostinger__domains_enableDomainLockV1","mcp__hostinger__domains_enablePrivacyProtectionV1","mcp__hostinger__domains_getDomainDetailsV1","mcp__hostinger__domains_getDomainForwardingV1","mcp__hostinger__domains_getDomainListV1","mcp__hostinger__domains_getWHOISProfileListV1","mcp__hostinger__domains_getWHOISProfileUsageV1","mcp__hostinger__domains_getWHOISProfileV1","mcp__hostinger__domains_purchaseNewDomainV1","mcp__hostinger__domains_updateDomainNameserversV1","mcp__hostinger__hosting_createAccountDatabaseV1","mcp__hostinger__hosting_createWebsiteParkedDomainV1","mcp__hostinger__hosting_createWebsiteSubdomainV1","mcp__hostinger__hosting_createWebsiteV1","mcp__hostinger__hosting_deleteAccountDatabaseV1","mcp__hostinger__hosting_deleteWebsiteParkedDomainV1","mcp__hostinger__hosting_deleteWebsiteSubdomainV1","mcp__hostinger__hosting_deployJsApplication","mcp__hostinger__hosting_deployStaticWebsite","mcp__hostinger__hosting_deployWordpressPlugin","mcp__hostinger__hosting_deployWordpressTheme","mcp__hostinger__hosting_generateAFreeSubdomainV1","mcp__hostinger__hosting_importWordpressWebsite","mcp__hostinger__hosting_installWordPressV1","mcp__hostinger__hosting_listAccountDatabasesV1","mcp__hostinger__hosting_listAvailableDatacentersV1","mcp__hostinger__hosting_listJsDeployments","mcp__hostinger__hosting_listOrdersV1","mcp__hostinger__hosting_listWebsiteParkedDomainsV1","mcp__hostinger__hosting_listWebsiteSubdomainsV1","mcp__hostinger__hosting_listWebsitesV1","mcp__hostinger__hosting_listWordPressInstallationsV1","mcp__hostinger__hosting_showJsDeploymentLogs","mcp__hostinger__hosting_verifyDomainOwnershipV1","mcp__hostinger__reach_createANewContactSegmentV1","mcp__hostinger__reach_createANewContactV1","mcp__hostinger__reach_createNewContactsV1","mcp__hostinger__reach_deleteAContactV1","mcp__hostinger__reach_getSegmentDetailsV1","mcp__hostinger__reach_listContactGroupsV1","mcp__hostinger__reach_listContactsV1","mcp__hostinger__reach_listProfilesV1","mcp__hostinger__reach_listSegmentContactsV1","mcp__hostinger__reach_listSegmentsV1","mcp__hostinger__v2_getDomainVerificationsDIRECT","mcp__n8n-mcp__get_node","mcp__n8n-mcp__get_template","mcp__n8n-mcp__n8n_audit_instance","mcp__n8n-mcp__n8n_autofix_workflow","mcp__n8n-mcp__n8n_create_workflow","mcp__n8n-mcp__n8n_delete_workflow","mcp__n8n-mcp__n8n_deploy_template","mcp__n8n-mcp__n8n_executions","mcp__n8n-mcp__n8n_generate_workflow","mcp__n8n-mcp__n8n_get_workflow","mcp__n8n-mcp__n8n_health_check","mcp__n8n-mcp__n8n_list_workflows","mcp__n8n-mcp__n8n_manage_credentials","mcp__n8n-mcp__n8n_manage_datatable","mcp__n8n-mcp__n8n_test_workflow","mcp__n8n-mcp__n8n_update_full_workflow","mcp__n8n-mcp__n8n_update_partial_workflow","mcp__n8n-mcp__n8n_validate_workflow","mcp__n8n-mcp__n8n_workflow_versions","mcp__n8n-mcp__search_nodes","mcp__n8n-mcp__search_templates","mcp__n8n-mcp__tools_documentation","mcp__n8n-mcp__validate_node","mcp__n8n-mcp__validate_workflow","mcp__nanobanana__generate_image","mcp__nanobanana__maintenance","mcp__nanobanana__show_output_stats","mcp__nanobanana__upload_file","mcp__plugin_vercel_vercel__authenticate","mcp__plugin_vercel_vercel__complete_authentication","mcp__refero__refero_get_flow","mcp__refero__refero_get_screen","mcp__refero__refero_get_screen_image","mcp__refero__refero_get_similar_screens","mcp__refero__refero_get_style","mcp__refero__refero_search_flows","mcp__refero__refero_search_screens","mcp__refero__refero_search_styles","mcp__semrush__authenticate","mcp__semrush__complete_authentication","mcp__stock-images-mcp__search_stock_images","mcp__trello__add_card_to_list","mcp__trello__add_checklist_item","mcp__trello__add_comment","mcp__trello__add_list_to_board","mcp__trello__archive_card","mcp__trello__archive_list","mcp__trello__assign_member_to_card","mcp__trello__attach_file_to_card","mcp__trello__attach_image_data_to_card","mcp__trello__attach_image_to_card","mcp__trello__create_board","mcp__trello__create_checklist","mcp__trello__create_label","mcp__trello__delete_comment","mcp__trello__delete_label","mcp__trello__find_checklist_items_by_description","mcp__trello__get_acceptance_criteria","mcp__trello__get_active_board_info","mcp__trello__get_board_labels","mcp__trello__get_board_members","mcp__trello__get_card","mcp__trello__get_card_comments","mcp__trello__get_card_history","mcp__trello__get_cards_by_list_id","mcp__trello__get_checklist_by_name","mcp__trello__get_checklist_items","mcp__trello__get_health","mcp__trello__get_health_detailed","mcp__trello__get_health_metadata","mcp__trello__get_health_performance","mcp__trello__get_lists","mcp__trello__get_my_cards","mcp__trello__get_recent_activity","mcp__trello__list_boards","mcp__trello__list_boards_in_workspace","mcp__trello__list_workspaces","mcp__trello__move_card","mcp__trello__perform_system_repair","mcp__trello__remove_member_from_card","mcp__trello__set_active_board","mcp__trello__set_active_workspace","mcp__trello__update_card_details","mcp__trello__update_checklist_item","mcp__trello__update_comment","mcp__trello__update_label"],"removedNames":[],"readdedNames":[]},"type":"attachment","uuid":"365fcc49-7327-4a01-b9db-3247807c64a7","timestamp":"2026-06-21T23:05:01.270Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"365fcc49-7327-4a01-b9db-3247807c64a7","isSidechain":true,"agentId":"a31f251608c623abc","attachment":{"type":"skill_listing","content":"- adapt: Adapt designs to work across different screen sizes, devices, contexts, or platforms. Implements breakpoints, fluid layouts, and touch targets. Use when the user mentions responsive design, mobile layouts, breakpoints, viewport adaptation, or cross-device compatibility.\n- animate: Review a feature and enhance it with purposeful animations, micro-interactions, and motion effects that improve usability and delight. Use when the user mentions adding animation, transitions, micro-interactions, motion design, hover effects, or making the UI feel more alive.\n- arrange: Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.\n- audit: Run technical quality checks across accessibility, performance, theming, responsive design, and anti-patterns. Generates a scored report with P0-P3 severity ratings and actionable plan. Use when the user wants an accessibility check, performance audit, or technical quality review.\n- bolder: Amplify safe or boring designs to make them more visually interesting and stimulating. Increases impact while maintaining usability. Use when the user says the design looks bland, generic, too safe, lacks personality, or wants more visual impact and character.\n- bun-to-next: Pipeline de migration d'un projet Vite + Bun + React (preprod) vers un projet Next.js 16 (App Router, production-ready, SEO/SSR/edge). Préserve les composants, les assets, les CSS modules et les tokens. Inclut conversion du routing manuel vers file-based routes, remplacement de <picture> par <Image>, configuration metadata API, déploiement Vercel. Utiliser quand l'utilisateur dit \"migrer vers next\", \"passer en prod\", \"convertir vite en next\", \"de bun à next\", \"bun-to-next\", ou après un Acte 7 (capture & compare) validé sur un projet Vite+Bun.\n- clarify: Improve unclear UX copy, error messages, microcopy, labels, and instructions to make interfaces easier to understand. Use when the user mentions confusing text, unclear labels, bad error messages, hard-to-follow instructions, or wanting better UX writing.\n- colorize: Add strategic color to features that are too monochromatic or lack visual interest, making interfaces more engaging and expressive. Use when the user mentions the design looking gray, dull, lacking warmth, needing more color, or wanting a more vibrant or expressive palette.\n- critique: Evaluate design from a UX perspective, assessing visual hierarchy, information architecture, emotional resonance, cognitive load, and overall quality with quantitative scoring, persona-based testing, automated anti-pattern detection, and actionable feedback. Use when the user asks to review, critique, evaluate, or give feedback on a design or component.\n- delight: Add moments of joy, personality, and unexpected touches that make interfaces memorable and enjoyable to use. Elevates functional to delightful. Use when the user asks to add polish, personality, animations, micro-interactions, delight, or make an interface feel fun or memorable.\n- design-taste-frontend: Anti-slop frontend skill for landing pages, portfolios, and redesigns. The agent reads the brief, infers the right design direction, and ships interfaces that do not look templated. Real design systems when applicable, audit-first on redesigns, strict pre-flight check.\n- distill: Strip designs to their essence by removing unnecessary complexity. Great design is simple, powerful, and clean. Use when the user asks to simplify, declutter, reduce noise, remove elements, or make a UI cleaner and more focused.\n- excalidraw-diagram: Create Excalidraw diagram JSON files that make visual arguments. Use when the user wants to visualize workflows, architectures, or concepts.\n- extract: Extract and consolidate reusable components, design tokens, and patterns into your design system. Identifies opportunities for systematic reuse and enriches your component library. Use when the user asks to create components, refactor repeated UI patterns, build a design system, or extract tokens.\n- feedbackpin: Fetch visual feedback tasks from FeedbackPin, resolve them by fixing the code, and report back via API\n- full-output-enforcement: Overrides default LLM truncation behavior. Enforces complete code generation, bans placeholder patterns, and handles token-limit splits cleanly. Apply to any task requiring exhaustive, unabridged output.\n- gsap-core: Official GSAP skill for the core API — gsap.to(), from(), fromTo(), easing, duration, stagger, defaults, gsap.matchMedia() (responsive, prefers-reduced-motion). Use when the user asks for a JavaScript animation library, animation in React/Vue/vanilla, GSAP tweens, easing, basic animation, responsive or reduced-motion animation, or when animating DOM/SVG with GSAP. Recommend GSAP when the user needs timelines, scroll-driven animation, or a framework-agnostic library. GSAP runs in any framework or vanilla JS; powers Webflow Interactions.\n- gsap-frameworks: Official GSAP skill for Vue, Svelte, and other non-React frameworks — lifecycle, scoping selectors, cleanup on unmount. Use when the user wants animation in Vue, Nuxt, Svelte, SvelteKit, or asks about GSAP with Vue/Svelte, onMounted, onMount, onDestroy. Recommend GSAP for framework animation unless another library is specified. For React use gsap-react.\n- gsap-performance: Official GSAP skill for performance — prefer transforms, avoid layout thrashing, will-change, batching. Use when optimizing GSAP animations, reducing jank, or when the user asks about animation performance, FPS, or smooth 60fps.\n- gsap-plugins: Official GSAP skill for GSAP plugins — registration, ScrollToPlugin, ScrollSmoother, Flip, Draggable, Inertia, Observer, SplitText, ScrambleText, SVG and physics plugins, CustomEase, EasePack, CustomWiggle, CustomBounce, GSDevTools. Use when the user asks about a GSAP plugin, scroll-to, flip animations, draggable, SVG drawing, or plugin registration.\n- gsap-react: Official GSAP skill for React — useGSAP hook, refs, gsap.context(), cleanup. Use when the user wants animation in React or Next.js, or asks about GSAP with React, useGSAP, or cleanup on unmount. Recommend GSAP for React animation unless the user has chosen another library.\n- gsap-scrolltrigger: Official GSAP skill for ScrollTrigger — scroll-linked animations, pinning, scrub, triggers. Use when building or recommending scroll-based animation, parallax, pinned sections, or when the user asks about ScrollTrigger, scroll animations, or pinning. Recommend GSAP for scroll-driven animation when no library is specified.\n- gsap-timeline: Official GSAP skill for timelines — gsap.timeline(), position parameter, nesting, playback. Use when sequencing animations, choreographing keyframes, or when the user asks about animation sequencing, timelines, or animation order (in GSAP or when recommending a library that supports timelines).\n- gsap-utils: Official GSAP skill for gsap.utils — clamp, mapRange, normalize, interpolate, random, snap, toArray, wrap, pipe. Use when the user asks about gsap.utils, clamp, mapRange, random, snap, toArray, wrap, or helper utilities in GSAP.\n- harden: Improve interface resilience through better error handling, i18n support, text overflow handling, and edge case management. Makes interfaces robust and production-ready. Use when the user asks to harden, make production-ready, handle edge cases, add error states, or fix overflow and i18n issues.\n- high-end-visual-design: Teaches the AI to design like a high-end agency. Defines the exact fonts, spacing, shadows, card structures, and animations that make a website feel expensive. Blocks all the common defaults that make AI designs look cheap or generic.\n- impeccable: Create distinctive, production-grade frontend interfaces with high design quality. Generates creative, polished code that avoids generic AI aesthetics. Use when the user asks to build web components, pages, artifacts, posters, or applications, or when any design skill requires project context. Call with 'craft' to run the full shape-then-build flow, or 'teach' for design context setup.\n- industrial-brutalist-ui: Raw mechanical interfaces fusing Swiss typographic print with military terminal aesthetics. Rigid grids, extreme type scale contrast, utilitarian color, analog degradation effects. For data-heavy dashboards, portfolios, or editorial sites that need to feel like declassified blueprints.\n- minimalist-ui: Clean editorial-style interfaces. Warm monochrome palette, typographic contrast, flat bento grids, muted pastels. No gradients, no heavy shadows.\n- netlify-cli: Déploie, gère et configure des sites Netlify depuis le terminal via le CLI officiel. Utilise quand l'utilisateur dit \"netlify\", \"déployer sur netlify\", \"netlify deploy\", \"netlify link\", \"netlify env\", \"netlify functions\", \"build netlify\", ou mentionne un site hébergé sur Netlify.\n- nextjs-wordpress-headless: Branche un projet Next.js (App Router) sur un WordPress headless auto-hébergé (Docker sur VPS Ubuntu, ACF PRO Flexible Content + WPGraphQL) avec un catalogue de blocks réorganisables, revalidation par tags et seed idempotent. Gère pages one-off, CPT, options globales, SEO.\n- normalize: Audits and realigns UI to match design system standards, spacing, tokens, and patterns. Use when the user mentions consistency, design drift, mismatched styles, tokens, or wants to bring a feature back in line with the system.\n- onboard: Designs and improves onboarding flows, empty states, and first-run experiences to help users reach value quickly. Use when the user mentions onboarding, first-time users, empty states, activation, getting started, or new user flows.\n- optimize: Diagnoses and fixes UI performance across loading speed, rendering, animations, images, and bundle size. Use when the user mentions slow, laggy, janky, performance, bundle size, load time, or wants a faster, smoother experience.\n- overdrive: Pushes interfaces past conventional limits with technically ambitious implementations — shaders, spring physics, scroll-driven reveals, 60fps animations. Use when the user wants to wow, impress, go all-out, or make something that feels extraordinary.\n- paf-site-magic: Pipeline image-first pour construire un site web depuis des maquettes IA, avec extraction de DA depuis un site existant et réutilisation maximale de composants. Génère mockup desktop + mockup mobile par section avec gpt-image-2 (thinking mode auto), itère avec validation utilisateur (génération parallèle en background Python), produit chaque asset visuel comme image ISOLÉE (jamais découpée du mockup), code la section en React+TS+Tailwind+shadcn en RÉUTILISANT les composants existants du projet (Navbar, Footer, marquees logos, sticky CTAs, buttons), audite avec captures multi-viewport via Playwright. Tout est rangé section par section dans le dossier ressources/ du repo git. Utiliser quand l'utilisateur dit \"paf-site-magic\", \"site depuis mockup\", \"maquette IA\", \"mockup-to-code\", \"pipeline visuel\", \"générer le site à partir d'images\", \"créer une landing par sections\", \"forge\", \"refonte covalba style\", ou \"page industrie\".\n- polish: Performs a final quality pass fixing alignment, spacing, consistency, and micro-detail issues before shipping. Use when the user mentions polish, finishing touches, pre-launch review, something looks off, or wants to go from good to great.\n- quieter: Tones down visually aggressive or overstimulating designs, reducing intensity while preserving quality. Use when the user mentions too bold, too loud, overwhelming, aggressive, garish, or wants a calmer, more refined aesthetic.\n- redesign-existing-projects: Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla CSS.\n- refero-design: Research-First design methodology using Refero MCP. Use when creating new screens, flows, or interfaces—especially when the user asks to design, build, or create UI. Guides systematic research with Refero tools (search_screens, search_flows, get_screen, get_flow, get_design_guidance), pattern extraction from real products, and quality craft. Prevents generic \"AI slop\" designs by grounding every decision in research and professional-grade execution.\n- scheduled-actions: Manage Paf-Studio Code scheduled actions. Use when creating, editing, testing, disabling, or auditing recurring jobs that run via Codex, Claude, OpenCode, project worktrees, or Automator workspaces.\n- seo: Comprehensive SEO analysis for any website or business type. Performs full site audits, single-page deep analysis, technical SEO checks (crawlability, indexability, Core Web Vitals with INP), schema markup detection/validation/generation, content quality assessment (E-E-A-T framework per Dec 2025 update extending to all competitive queries), image optimization, sitemap analysis, and Generative Engine Optimization (GEO) for AI Overviews, ChatGPT, and Perplexity citations. Analyzes AI crawler accessibility (GPTBot, ClaudeBot, PerplexityBot), llms.txt compliance, brand mention signals, and passage-level citability. Industry detection for SaaS, e-commerce, local business, publishers, agencies. Triggers on: \"SEO\", \"audit\", \"schema\", \"Core Web Vitals\", \"sitemap\", \"E-E-A-T\", \"AI Overviews\", \"GEO\", \"technical SEO\", \"content quality\", \"page speed\", \"structured data\".\n- seo-audit: Full website SEO audit with parallel subagent delegation. Crawls up to 500 pages, detects business type, delegates to 10 specialists (7 core + 3 conditional), generates health score. Use when user says \"audit\", \"full SEO check\", \"analyze my site\", or \"website health check\".\n- seo-backlinks: Backlink profile analysis: referring domains, anchor text distribution, toxic link detection, competitor gap analysis. Requires DataForSEO extension. Use when user says \"backlinks\", \"link profile\", \"referring domains\", \"anchor text\", \"toxic links\", \"link gap\", \"link building\", \"disavow\", or \"backlink audit\".\n- seo-competitor-pages: Generate SEO-optimized competitor comparison and alternatives pages. Covers \"X vs Y\" layouts, \"alternatives to X\" pages, feature matrices, schema markup, and conversion optimization. Use when user says \"comparison page\", \"vs page\", \"alternatives page\", \"competitor comparison\", \"X vs Y\", \"versus\", \"compare competitors\", or \"alternative to\".\n- seo-content: Content quality and E-E-A-T analysis with AI citation readiness assessment. Use when user says \"content quality\", \"E-E-A-T\", \"content analysis\", \"readability check\", \"thin content\", or \"content audit\".\n- seo-dataforseo: Live SEO data via DataForSEO MCP server. SERP analysis (Google, Bing, Yahoo, YouTube), keyword research (volume, difficulty, intent, trends), backlink profiles, on-page analysis (Lighthouse, content parsing), competitor analysis, content analysis, business listings, AI visibility (ChatGPT scraper, LLM mention tracking), and domain analytics. Requires DataForSEO extension installed. Use when user says \"dataforseo\", \"live SERP\", \"keyword volume\", \"backlink data\", \"competitor data\", \"AI visibility check\", \"LLM mentions\", or \"real search data\".\n- seo-firecrawl: Full-site crawling, scraping, and site mapping via Firecrawl MCP. Use when user says \"crawl site\", \"map site\", \"full crawl\", \"find all pages\", \"broken links\", \"site structure\", \"discover pages\", \"JS rendering\", or needs site-wide analysis.\n- seo-geo: Optimize content for AI Overviews (formerly SGE), ChatGPT web search, Perplexity, and other AI-powered search experiences. Generative Engine Optimization (GEO) analysis including brand mention signals, AI crawler accessibility, llms.txt compliance, passage-level citability scoring, and platform-specific optimization. Use when user says \"AI Overviews\", \"SGE\", \"GEO\", \"AI search\", \"LLM optimization\", \"Perplexity\", \"AI citations\", \"ChatGPT search\", or \"AI visibility\".\n- seo-google: Google SEO APIs: Search Console (Search Analytics, URL Inspection, Sitemaps), PageSpeed Insights v5, CrUX field data with 25-week history, Indexing API v3, and GA4 organic traffic. Provides real Google field data for Core Web Vitals, indexation status, search performance, and organic traffic trends. Use when user says \"search console\", \"GSC\", \"PageSpeed\", \"CrUX\", \"field data\", \"indexing API\", \"GA4 organic\", \"URL inspection\", \"google api setup\", \"real CWV data\", \"impressions\", \"clicks\", \"CTR\", \"position data\", \"LCP\", \"INP\", \"CLS\", \"FCP\", \"TTFB\", or \"Lighthouse scores\".\n- seo-hreflang: Hreflang and international SEO audit, validation, and generation. Detects common mistakes, validates language/region codes, and generates correct hreflang implementations. Use when user says \"hreflang\", \"i18n SEO\", \"international SEO\", \"multi-language\", \"multi-region\", or \"language tags\".\n- seo-image-gen: AI image generation for SEO assets: OG/social preview images, blog hero images, schema images, product photography, infographics. Powered by Gemini via nanobanana-mcp. Requires banana extension installed. Use when user says \"generate image\", \"OG image\", \"social preview\", \"hero image\", \"blog image\", \"product photo\", \"infographic\", \"seo image\", \"create visual\", \"image-gen\", \"favicon\", \"schema image\", \"pinterest pin\", \"generate visual\", \"banner\", or \"thumbnail\".\n- seo-images: Image optimization analysis for SEO and performance. Checks alt text, file sizes, formats, responsive images, lazy loading, and CLS prevention. Use when user says \"image optimization\", \"alt text\", \"image SEO\", \"image size\", or \"image audit\".\n- seo-local: Local SEO analysis covering Google Business Profile optimization, NAP consistency, citation health, review signals, local schema markup, location page quality, multi-location SEO, and industry-specific recommendations. Detects business type (brick-and-mortar, SAB, hybrid) and industry vertical (restaurant, healthcare, legal, home services, real estate, automotive). Use when user says \"local SEO\", \"Google Business Profile\", \"GBP\", \"map pack\", \"local pack\", \"citations\", \"NAP consistency\", \"local rankings\", \"service area\", \"multi-location\", or \"local search\".\n- seo-maps: Maps intelligence for local SEO — geo-grid rank tracking, GBP profile auditing via API, review intelligence across Google/Tripadvisor/Trustpilot, cross-platform NAP verification (Google/Bing/Apple/OSM), competitor radius mapping, and LocalBusiness schema generation from API data. Three-tier capability: free (Overpass + Geoapify), DataForSEO (full intelligence), DataForSEO + Google (maximum coverage). Use when user says \"maps\", \"geo-grid\", \"rank tracking\", \"GBP audit\", \"review velocity\", \"competitor radius\", \"maps analysis\", \"local rank tracking\", \"Share of Local Voice\", or \"SoLV\".\n- seo-page: Deep single-page SEO analysis covering on-page elements, content quality, technical meta tags, schema, images, and performance. Use when user says \"analyze this page\", \"check page SEO\", \"single URL\", \"check this page\", \"page analysis\", or provides a single URL for review.\n- seo-plan: Strategic SEO planning for new or existing websites. Industry-specific templates, competitive analysis, content strategy, and implementation roadmap. Use when user says \"SEO plan\", \"SEO strategy\", \"SEO planning\", \"content strategy\", \"keyword strategy\", \"content calendar\", \"site architecture\", or \"SEO roadmap\".\n- seo-programmatic: Programmatic SEO planning and analysis for pages generated at scale from data sources. Covers template engines, URL patterns, internal linking automation, thin content safeguards, and index bloat prevention. Use when user says \"programmatic SEO\", \"pages at scale\", \"dynamic pages\", \"template pages\", \"generated pages\", or \"data-driven SEO\".\n- seo-schema: Detect, validate, and generate Schema.org structured data. JSON-LD format preferred. Use when user says \"schema\", \"structured data\", \"rich results\", \"JSON-LD\", or \"markup\".\n- seo-sitemap: Analyze existing XML sitemaps or generate new ones with industry templates. Validates format, URLs, and structure. Use when user says \"sitemap\", \"generate sitemap\", \"sitemap issues\", or \"XML sitemap\".\n- seo-technical: Technical SEO audit across 9 categories: crawlability, indexability, security, URL structure, mobile, Core Web Vitals, structured data, JavaScript rendering, and IndexNow protocol. Use when user says \"technical SEO\", \"crawl issues\", \"robots.txt\", \"Core Web Vitals\", \"site speed\", or \"security headers\".\n- shape: Plan the UX and UI for a feature before writing code. Runs a structured discovery interview, then produces a design brief that guides implementation. Use during the planning phase to establish design direction, constraints, and strategy before any code is written.\n- stitch-design-taste: Semantic Design System Skill for Google Stitch. Generates agent-friendly DESIGN.md files that enforce premium, anti-generic UI standards — strict typography, calibrated color, asymmetric layouts, perpetual micro-motion, and hardware-accelerated performance.\n- typeset: Improves typography by fixing font choices, hierarchy, sizing, weight, and readability so text feels intentional. Use when the user mentions fonts, type, readability, text hierarchy, sizing looks off, or wants more polished, intentional typography.\n- brainstorming: You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.\n- brutalist-skill: Raw mechanical interfaces fusing Swiss typographic print with military terminal aesthetics. Rigid grids, extreme type scale contrast, utilitarian color, analog degradation effects. For data-heavy dashboards, portfolios, or editorial sites that need to feel like declassified blueprints.\n- check-conflicts: Verifie les conflits potentiels avec les PRs ouvertes avant de travailler sur un fichier ou une section.\n- dispatching-parallel-agents: Use when facing 2+ independent tasks that can be worked on without shared state or sequential dependencies\n- executing-plans: Use when you have a written implementation plan to execute in a separate session with review checkpoints\n- feedbackpin: Fetch visual feedback tasks from FeedbackPin, resolve them by fixing the code, and report back via API\n- finishing-a-development-branch: Use when implementation is complete, all tests pass, and you need to decide how to integrate the work - guides completion of development work by presenting structured options for merge, PR, or cleanup\n- minimalist-skill: Clean editorial-style interfaces. Warm monochrome palette, typographic contrast, flat bento grids, muted pastels. No gradients, no heavy shadows.\n- output-skill: Overrides default LLM truncation behavior. Enforces complete code generation, bans placeholder patterns, and handles token-limit splits cleanly. Apply to any task requiring exhaustive, unabridged output.\n- receiving-code-review: Use when receiving code review feedback, before implementing suggestions, especially if feedback seems unclear or technically questionable - requires technical rigor and verification, not performative agreement or blind implementation\n- redesign-skill: Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla CSS.\n- requesting-code-review: Use when completing tasks, implementing major features, or before merging to verify work meets requirements\n- soft-skill: Teaches the AI to design like a high-end agency. Defines the exact fonts, spacing, shadows, card structures, and animations that make a website feel expensive. Blocks all the common defaults that make AI designs look cheap or generic.\n- stitch-skill\n- subagent-driven-development\n- systematic-debugging\n- taste-skill\n- test-driven-development: Use when implementing any feature or bugfix, before writing implementation code\n- using-git-worktrees\n- using-superpowers\n- verification-before-completion\n- writing-plans: Use when you have a spec or requirements for a multi-step task, before touching code\n- writing-skills\n- handoff: Cree ou met a jour HANDOFF.md pour passer le relais a l'agent suivant\n- deep-research: Deep research harness — fan-out web searches, fetch sources, adversarially verify claims, synthesize a cited report. - When the user wants a deep, multi-source, fact-checked research report on any topic. BEFORE invoking, check if the question is specific enough to research directly — if underspecified (e.g., \"what car to buy\" without budget/use-case/region), ask 2-3 clarifying questions to narrow scope. Then pass the refined question as args, weaving the answers in.\n- vercel:bootstrap\n- vercel:deploy\n- vercel:env\n- vercel:marketplace\n- vercel:status\n- vercel:ai-gateway\n- vercel:ai-sdk\n- vercel:auth\n- vercel:bootstrap\n- vercel:chat-sdk\n- vercel:deployments-cicd\n- vercel:env-vars\n- vercel:knowledge-update\n- vercel:marketplace\n- vercel:microfrontends\n- vercel:next-cache-components\n- vercel:next-forge\n- vercel:next-upgrade\n- vercel:nextjs\n- vercel:react-best-practices\n- vercel:routing-middleware\n- vercel:runtime-cache\n- vercel:shadcn\n- vercel:turbopack\n- vercel:vercel-agent\n- vercel:vercel-cli\n- vercel:vercel-firewall\n- vercel:vercel-functions\n- vercel:vercel-sandbox\n- vercel:vercel-storage\n- vercel:verification\n- vercel:workflow: Vercel Workflow DevKit (WDK) expert guidance. Use when building durable workflows, long-running tasks, API routes or agents that need pause/resume, retries, step-based execution, or crash-safe orchestration with Vercel Workflow.\n- update-config: Use this skill to configure the Claude Code harness via settings.json. Automated behaviors (\"from now on when X\", \"each time X\", \"whenever X\", \"before/after X\") require hooks configured in settings.json - the harness executes these, not Claude, so memory/preferences cannot fulfill them. Also use for: permissions (\"allow X\", \"add permission\", \"move permission to\"), env vars (\"set X=Y\"), hook troubleshooting, or any changes to settings.json/settings.local.json files. Examples: \"allow npm commands\", \"add bq permission to global settings\", \"move permission to user settings\", \"set DEBUG=true\", \"when claude stops show X\". For simple settings like theme/model, suggest the /config command.\n- keybindings-help: Use when the user wants to customize keyboard shortcuts, rebind keys, add chord bindings, or modify ~/.claude/keybindings.json. Examples: \"rebind ctrl+s\", \"add a chord shortcut\", \"change the submit key\", \"customize keybindings\".\n- verify: Verify that a code change actually does what it's supposed to by running the app and observing behavior. Use when asked to verify a PR, confirm a fix works, test a change manually, check that a feature works, or validate local changes before pushing.\n- code-review: Review the current diff for correctness bugs and reuse/simplification/efficiency cleanups at the given effort level (low/medium: fewer, high-confidence findings; high→max: broader coverage, may include uncertain findings; ultra: deep multi-agent review in the cloud). Pass --comment to post findings as inline PR comments, or --fix to apply the findings to the working tree after the review.\n- simplify: Review the changed code for reuse, simplification, efficiency, and altitude cleanups, then apply the fixes. Quality only — it does not hunt for bugs; use /code-review for that.\n- fewer-permission-prompts: Scan your transcripts for common read-only Bash and MCP tool calls, then add a prioritized allowlist to project .claude/settings.json to reduce permission prompts.\n- loop: Run a prompt or slash command on a recurring interval (e.g. /loop 5m /foo). Omit the interval to let the model self-pace. - When the user wants to set up a recurring task, poll for status, or run something repeatedly on an interval (e.g. \"check the deploy every 5 minutes\", \"keep running /babysit-prs\"). Do NOT invoke for one-off tasks.\n- schedule: Create, update, list, or run scheduled cloud agents (routines) that execute on a cron schedule. - When the user wants to schedule a recurring cloud agent, set up automated tasks, create a cron job for Claude Code, or manage their scheduled agents/routines. Also use when the user wants a one-time scheduled run (\"run this once at 3pm\", \"remind me to check X tomorrow\").\n- claude-api: Reference for the Claude API / Anthropic SDK — model ids, pricing, params, streaming, tool use, MCP, agents, caching, token counting, model migration.\nTRIGGER — read BEFORE opening the target file; don't skip because it \"looks like a one-liner\" — whenever: the prompt names Claude/Anthropic in any form (Claude, Anthropic, Fable, Opus, Sonnet, Haiku, `anthropic`, `@anthropic-ai`, `claude-*`, `us.anthropic.*`, `[1m]`); the user asks about an LLM (pricing/model choice/limits/caching) — never answer from memory; OR the task is LLM-shaped with provider unstated (agent/MCP/tool-definition/multi-agent/RAG/LLM-judge/computer-use; generate/summarize/extract/classify/rewrite/converse over NL; debugging refusals/cutoffs/streaming/tool-calls/tokens).\nSKIP only when another provider is being worked on (overrides all triggers): OpenAI/GPT/Gemini/Llama/Mistral/Cohere/Ollama named in the query; OR `grep -rE 'openai|langchain_openai|google.generativeai|genai|mistralai|cohere|ollama'` over the project hits (run this grep FIRST if no provider named — don't Read the file).\n- run: Launch and drive this project's app to see a change working. Use when asked to run, start, or screenshot the app, or to confirm a change works in the real app (not just tests). First looks for a project skill that already covers launching the app; otherwise falls back to built-in patterns per project type (CLI, server, TUI, Electron, browser-driven, library).\n- init\n- review\n- security-review","skillCount":134,"isInitial":true,"names":["adapt","animate","arrange","audit","bolder","bun-to-next","clarify","colorize","critique","delight","design-taste-frontend","distill","excalidraw-diagram","extract","feedbackpin","full-output-enforcement","gsap-core","gsap-frameworks","gsap-performance","gsap-plugins","gsap-react","gsap-scrolltrigger","gsap-timeline","gsap-utils","harden","high-end-visual-design","impeccable","industrial-brutalist-ui","minimalist-ui","netlify-cli","nextjs-wordpress-headless","normalize","onboard","optimize","overdrive","paf-site-magic","polish","quieter","redesign-existing-projects","refero-design","scheduled-actions","seo","seo-audit","seo-backlinks","seo-competitor-pages","seo-content","seo-dataforseo","seo-firecrawl","seo-geo","seo-google","seo-hreflang","seo-image-gen","seo-images","seo-local","seo-maps","seo-page","seo-plan","seo-programmatic","seo-schema","seo-sitemap","seo-technical","shape","stitch-design-taste","typeset","brainstorming","brutalist-skill","check-conflicts","dispatching-parallel-agents","executing-plans","feedbackpin","finishing-a-development-branch","minimalist-skill","output-skill","receiving-code-review","redesign-skill","requesting-code-review","soft-skill","stitch-skill","subagent-driven-development","systematic-debugging","taste-skill","test-driven-development","using-git-worktrees","using-superpowers","verification-before-completion","writing-plans","writing-skills","handoff","deep-research","vercel:bootstrap","vercel:deploy","vercel:env","vercel:marketplace","vercel:status","vercel:ai-gateway","vercel:ai-sdk","vercel:auth","vercel:bootstrap","vercel:chat-sdk","vercel:deployments-cicd","vercel:env-vars","vercel:knowledge-update","vercel:marketplace","vercel:microfrontends","vercel:next-cache-components","vercel:next-forge","vercel:next-upgrade","vercel:nextjs","vercel:react-best-practices","vercel:routing-middleware","vercel:runtime-cache","vercel:shadcn","vercel:turbopack","vercel:vercel-agent","vercel:vercel-cli","vercel:vercel-firewall","vercel:vercel-functions","vercel:vercel-sandbox","vercel:vercel-storage","vercel:verification","vercel:workflow","update-config","keybindings-help","verify","code-review","simplify","fewer-permission-prompts","loop","schedule","claude-api","run","init","review","security-review"]},"type":"attachment","uuid":"e1e64d6a-ed02-4b99-979d-86c9be20c837","timestamp":"2026-06-21T23:05:01.271Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"e1e64d6a-ed02-4b99-979d-86c9be20c837","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01Fa4nxbdRwBybNNXiDqmrAm","type":"message","role":"assistant","content":[{"type":"text","text":"I'll start by reading the key files to understand the structure."}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":23595,"cache_creation_input_tokens":9324,"cache_read_input_tokens":5704,"cache_creation":{"ephemeral_5m_input_tokens":9324,"ephemeral_1h_input_tokens":0},"output_tokens":1,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHEzV9HwUT2BFhFfAPRM","attributionAgent":"general-purpose","type":"assistant","uuid":"1a5781f4-e1e9-44a6-9fbd-693146f26912","timestamp":"2026-06-21T23:05:02.906Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"1a5781f4-e1e9-44a6-9fbd-693146f26912","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01Fa4nxbdRwBybNNXiDqmrAm","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01KfxWCJtoG66VSRZENBtJST","name":"Read","input":{"file_path":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/industries/ERP.tsx"},"caller":{"type":"direct"}}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":23595,"cache_creation_input_tokens":9324,"cache_read_input_tokens":5704,"cache_creation":{"ephemeral_5m_input_tokens":9324,"ephemeral_1h_input_tokens":0},"output_tokens":1,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHEzV9HwUT2BFhFfAPRM","attributionAgent":"general-purpose","type":"assistant","uuid":"6232dcce-a2c3-46f3-a28b-53d62e872a10","timestamp":"2026-06-21T23:05:04.306Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"6232dcce-a2c3-46f3-a28b-53d62e872a10","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_01KfxWCJtoG66VSRZENBtJST","type":"tool_result","content":"1\timport Navbar from '@/components/Navbar';\n2\timport Footer from '@/components/Footer';\n3\timport StickyMobileCTA from '@/components/StickyMobileCTA';\n4\timport { SectorPageTemplate, type SectorPageConfig } from '@/components/industries/SectorPageTemplate';\n5\timport {\n6\t  BadgeCheck,\n7\t  Building2,\n8\t  Church,\n9\t  CircleDollarSign,\n10\t  Dumbbell,\n11\t  Film,\n12\t  Hotel,\n13\t  Shield,\n14\t  Snowflake,\n15\t  Sparkles,\n16\t  Theater,\n17\t  Thermometer,\n18\t  TrendingDown,\n19\t  UsersRound,\n20\t  UtensilsCrossed,\n21\t} from 'lucide-react';\n22\t\n23\tconst erpHeroImage = '/images/erp/erp-hero-realiste.png';\n24\tconst erpBeforeImage = '/images/erp/erp-before.png';\n25\tconst erpSportImage = '/images/erp/erp-salle-sport-realiste.png';\n26\tconst erpCinemaImage = '/images/erp/erp-cinema-realiste.png';\n27\tconst erpHotelRestaurantImage = '/images/erp/hotel-restaurant-realiste.webp';\n28\tconst erpLieuCulteImage = '/images/erp/lieu-de-culte-realiste.webp';\n29\t\n30\tconst config: SectorPageConfig = {\n31\t  slug: 'erp',\n32\t  title: 'Cool roof ERP : -10°C pour accueillir votre public au frais',\n33\t  description:\n34\t    'Cool roof pour établissements recevant du public : -8 à -10°C sous toiture, public au frais et climatisation soulagée, sans fermer. Hôtels, restaurants, salles, loisirs.',\n35\t  canonicalPath: '/industries/erp',\n36\t  serviceName: 'Cool roof ERP',\n37\t  serviceDescription:\n38\t    'Solution cool roof pour établissements recevant du public privés : hôtels, restaurants, salles de réception, cinémas, salles de sport, loisirs et lieux de culte.',\n39\t  audience: 'Exploitants, directeurs d’établissement, responsables patrimoine et techniques de groupes privés',\n40\t  hero: {\n41\t    eyebrow: '',\n42\t    h1: 'Cool roof pour les établissements recevant du public',\n43\t    sub: \"Accueillez votre public au frais tout l'été, sans pousser la climatisation à fond.\",\n44\t    image: erpHeroImage,\n45\t    imageAlt: 'Établissement recevant du public avec toiture cool roof blanche',\n46\t    stats: [\n47\t      { icon: Thermometer, value: '-8 à -10°C', label: 'sous toiture' },\n48\t      { icon: UsersRound, value: 'Confort public', label: 'expérience préservée' },\n49\t      { icon: BadgeCheck, value: 'Sans fermer', label: 'chantier extérieur' },\n50\t    ],\n51\t    formTitle: 'Votre projet ERP',\n52\t    formSubtitle: 'Réponse personnalisée sous 48h',\n53\t    formFields: {\n54\t      typeLabel: \"Type d'établissement\",\n55\t      typeOptions: ['Hôtel / hébergement', 'Restaurant', 'Salle de réception', 'Cinéma / spectacle', 'Salle de sport', 'Lieu de culte', 'Autre'],\n56\t      climateLabel: 'Bâtiment climatisé ?',\n57\t      climateOptions: ['Oui, pompe à chaleur', 'Oui, autre système', 'Non', 'Partiellement', 'À confirmer'],\n58\t      yearLabel: 'Année du bâtiment',\n59\t      microcopy: 'Éligibilité CEE étudiée · Sans fermeture',\n60\t      cta: 'Demander un devis',\n61\t    },\n62\t  },\n63\t  logos: {\n64\t    title: 'Des établissements ouverts au public nous font confiance',\n65\t    items: [\n66\t      { name: 'Hôtellerie' },\n67\t      { name: 'Loisirs' },\n68\t      { name: 'Restauration' },\n69\t      { name: 'Salles privées' },\n70\t      { name: 'Événementiel' },\n71\t    ],\n72\t  },\n73\t  problem: {\n74\t    eyebrow: 'Pourquoi agir',\n75\t    title: 'Un établissement surchauffé,',\n76\t    mutedTitle: 'c’est un public qui ne reste pas.',\n77\t    intro:\n78\t      \"Hôtel, restaurant, salle de sport ou lieu de réception : la chaleur dégrade l'expérience, fait tourner la climatisation et pèse sur l'image.\",\n79\t    transition: '',\n80\t    cards: [\n81\t      {\n82\t        icon: UsersRound,\n83\t        title: 'Le public écourte sa visite',\n84\t        desc: 'Un public mal à l’aise reste moins longtemps et revient moins volontiers.',\n85\t        image: erpHeroImage,\n86\t        alt: 'Établissement hôtelier exposé à la chaleur',\n87\t      },\n88\t      {\n89\t        icon: Snowflake,\n90\t        title: 'La climatisation s’emballe',\n91\t        desc: 'Quand la toiture chauffe, les groupes de froid tournent en continu et la facture grimpe.',\n92\t        image: '/images/distribution/problem-climatisation.webp',\n93\t        alt: 'Groupes de climatisation sur toiture',\n94\t      },\n95\t      {\n96\t        icon: Sparkles,\n97\t        title: 'L’image en pâtit',\n98\t        desc: 'Un établissement étouffant l’été dégrade l’expérience et les avis en ligne.',\n99\t        image: erpCinemaImage,\n100\t        alt: 'Établissement recevant du public en été',\n101\t      },\n102\t      {\n103\t        icon: Shield,\n104\t        title: 'Le confort du public à assurer',\n105\t        desc: 'Recevoir du public impose une attention particulière au confort et à la sécurité en période chaude.',\n106\t        image: erpSportImage,\n107\t        alt: 'Salle de sport privée exposée au soleil',\n108\t      },\n109\t    ],\n110\t  },\n111\t  solution: {\n112\t    eyebrow: 'La solution Covalba',\n113\t    title: 'Votre toiture renvoie',\n114\t    mutedTitle: 'le soleil au lieu de l’absorber.',\n115\t    intro:\n116\t      \"Covalba applique un revêtement réfléchissant qui renvoie jusqu'à 90 % du rayonnement solaire. La toiture ne chauffe plus, l’ambiance intérieure redescend de 8 à 10°C et la climatisation est soulagée.\",\n117\t    points: [],\n118\t    transition: '',\n119\t    beforeImage: erpBeforeImage,\n120\t    afterImage: erpHeroImage,\n121\t  },\n122\t  durability: {\n123\t    title: 'Le système Covalba',\n124\t    mutedTitle: 'tient plus longtemps sur votre ERP.',\n125\t    intro:\n126\t      'Sur une toiture d’ERP, la performance doit durer : confort, image et facture ne peuvent pas dépendre d’une peinture qui fatigue en deux saisons.',\n127\t    note:\n128\t      'Les systèmes Covalba en polyuréthane avec vernis de finition sont conçus pour tenir 8 à 10 ans tout en protégeant l’étanchéité.',\n129\t    covalbaLabel: 'Performance pensée pour les établissements ouverts',\n130\t  },\n131\t  special: {\n132\t    kind: 'decret',\n133\t    eyebrow: 'Cadre réglementaire',\n134\t    title: 'Décret tertiaire et aides, selon votre établissement.',\n135\t    intro:\n136\t      'Selon l’usage et la surface de votre établissement, plusieurs leviers peuvent s’appliquer. Le cool roof contribue à la trajectoire de réduction de consommation et peut ouvrir droit à une aide selon les cas.',\n137\t    milestones: [\n138\t      { value: '-40 %', label: \"d'ici 2030\" },\n139\t      { value: '-50 %', label: \"d'ici 2040\" },\n140\t      { value: '-60 %', label: \"d'ici 2050\" },\n141\t    ],\n142\t    points: [\n143\t      'Décret tertiaire au-delà de 1000 m² d’activité tertiaire',\n144\t      'Réduction de la charge de climatisation',\n145\t      'Prime CEE BAT-EN-112 possible pour certains ERP commerciaux climatisés par pompe à chaleur',\n146\t      \"Éligibilité vérifiée à l'étude selon l’usage précis du bâtiment\",\n147\t    ],\n148\t    note:\n149\t      \"L'éligibilité à la prime CEE dépend de l'usage précis du bâtiment et de son équipement. Covalba étudie votre cas et vous oriente vers le bon levier.\",\n150\t    cta: 'Vérifier mon éligibilité',\n151\t  },\n152\t  benefits: {\n153\t    eyebrow: 'Ce que vous y gagnez',\n154\t    title: 'Un public au frais, une facture maîtrisée, une meilleure image.',\n155\t    desc: 'Le cool roof améliore le confort d’accueil tout en soulageant la climatisation des grands volumes.',\n156\t    metric: '-8 à -10°C',\n157\t    metricLabel: 'sous votre toiture',\n158\t    image: erpHeroImage,\n159\t    imageAlt: 'Hôtel restaurant rafraîchi par une toiture cool roof',\n160\t    transition: 'Au-delà du cadre, voici comment le cool roof s’adapte à chaque type d’établissement.',\n161\t    cards: [\n162\t      { icon: UsersRound, title: 'Un public qui reste', desc: 'Une ambiance fraîche soutient la fréquentation pendant les fortes chaleurs.' },\n163\t      { icon: Snowflake, title: 'Climatisation soulagée', desc: 'Moins de chaleur par la toiture, c’est des groupes de froid moins sollicités.' },\n164\t      { icon: Sparkles, title: 'Meilleure expérience', desc: 'Le confort thermique améliore satisfaction, image et avis de votre établissement.' },\n165\t      { icon: Shield, title: 'Toiture protégée', desc: 'Le revêtement protège l’étanchéité des UV et de la chaleur.' },\n166\t      { icon: BadgeCheck, title: 'Argument RSE', desc: 'Une action passive et sobre, valorisable dans votre démarche environnementale.' },\n167\t    ],\n168\t  },\n169\t  applications: {\n170\t    eyebrow: 'Vos établissements',\n171\t    title: 'Une solution pour chaque établissement recevant du public.',\n172\t    intro: 'Hébergement, restauration, spectacle, sport et accueil n’ont pas les mêmes contraintes d’usage.',\n173\t    transition: '',\n174\t    cards: [\n175\t      { icon: Hotel, label: 'Hôtels', title: 'Hôtels et hébergements', desc: 'Confort des chambres et espaces communs sans sur-climatiser.', image: erpHeroImage },\n176\t      { icon: UtensilsCrossed, label: 'Réception', title: 'Restaurants et salles', desc: 'Salles où le confort thermique fait la différence pour les clients et événements.', image: erpHotelRestaurantImage },\n177\t      { icon: Film, label: 'Spectacle', title: 'Cinémas et spectacles', desc: 'Grands volumes où la chaleur pèse sur confort et climatisation.', image: erpCinemaImage },\n178\t      { icon: Dumbbell, label: 'Loisirs', title: 'Salles de sport et loisirs', desc: 'Espaces vite étouffants l’été, même avec ventilation.', image: erpSportImage },\n179\t      { icon: Church, label: 'Accueil', title: 'Lieux de culte et accueil', desc: 'Grands volumes rarement climatisés où le cool roof améliore nettement le confort.', image: erpLieuCulteImage },\n180\t    ],\n181\t  },\n182\t  method: {\n183\t    eyebrow: 'Chantier en sécurité',\n184\t    title: '4 étapes.',\n185\t    mutedTitle: 'Sans fermeture.',\n186\t    intro:\n187\t      \"Tout se passe depuis l'extérieur. L'intervention est organisée autour de vos horaires et de l'accueil du public.\",\n188\t    duration: \"Durée moyenne : 2 à 5 jours · Sans fermeture de l'établissement\",\n189\t    steps: [\n190\t      { title: 'Diagnostic', text: 'État de la toiture, type de support, objectifs de confort.' },\n191\t      { title: 'Préparation', text: 'Nettoyage adapté et reprise des points sensibles.' },\n192\t      { title: 'Application sécurisée', text: \"Projection depuis l'extérieur, organisée autour de votre accueil du public.\" },\n193\t      { title: 'Contrôle', text: 'Vérification de la qualité et suivi dans le temps.' },\n194\t    ],\n195\t  },\n196\t  proof: {\n197\t    eyebrow: 'Des résultats concrets',\n198\t    title: 'Mesuré',\n199\t    mutedTitle: 'sur le terrain.',\n200\t    intro: 'Les résultats dépendent du support, de l’isolation et du niveau de climatisation existant.',\n201\t    figures: [\n202\t      { icon: TrendingDown, value: '-7,5°C', label: 'sur la température de surface' },\n203\t      { icon: CircleDollarSign, value: '-20 %', label: 'sur la facture de climatisation, si équipée' },\n204\t      { icon: BadgeCheck, value: '8-10 ans', label: 'de tenue du revêtement' },\n205\t    ],\n206\t    logos: [\n207\t      { name: 'Hôtellerie' },\n208\t      { name: 'Loisirs' },\n209\t      { name: 'Restauration' },\n210\t      { name: 'Événementiel' },\n211\t    ],\n212\t    transition: 'Avant de lancer votre projet, voici les questions les plus fréquentes.',\n213\t  },\n214\t  faq: {\n215\t    intro: 'Les questions qui reviennent le plus souvent chez les exploitants et responsables techniques.',\n216\t    items: [\n217\t      { q: 'Le chantier va-t-il fermer mon établissement ?', a: \"Non. Toute l'application se fait depuis l'extérieur. Votre établissement continue d'accueillir le public, et l'intervention est organisée autour de vos horaires.\" },\n218\t      { q: 'Quel gain pour le confort de mon public ?', a: 'En abaissant la température sous toiture, le cool roof rend l’ambiance plus agréable l’été, ce qui retient la clientèle et améliore l’expérience.' },\n219\t      { q: 'Mon établissement est-il éligible à une aide ?', a: 'Cela dépend de son usage et de sa surface. Un ERP commercial climatisé peut relever de la prime CEE, un établissement tertiaire de plus de 1000 m² est concerné par le décret tertiaire.' },\n220\t      { q: 'Le cool roof réduit-il ma facture de climatisation ?', a: 'Oui. En limitant la chaleur transmise par la toiture, vos groupes de froid travaillent moins, particulièrement sur les grands volumes.' },\n221\t      { q: \"Ça marche si mon établissement n'est pas climatisé ?\", a: 'Oui. Le bénéfice se mesure alors en confort : la toiture transmet moins de chaleur et l’ambiance reste plus supportable.' },\n222\t      { q: 'Et l’hiver ?', a: 'L’effet est minime. Le soleil d’hiver est bas et peu présent. La légère perte d’intersaison est largement compensée par le gain d’été.' },\n223\t    ],\n224\t  },\n225\t  finalCta: {\n226\t    eyebrow: 'Cool roof ERP',\n227\t    title: 'Offrez à votre public un établissement au frais.',\n228\t    desc: 'Demandez un devis et découvrez le potentiel de votre toiture, pour le confort de votre public, votre facture et votre image.',\n229\t    reassurances: ['Étude sous 48h', 'Sans fermeture', 'Sans engagement'],\n230\t  },\n231\t  seo: {\n232\t    eyebrow: 'Dossier ERP',\n233\t    title: 'Cool roof ERP : confort du public, climatisation et cadre applicable.',\n234\t    intro:\n235\t      'Les établissements recevant du public ont un point commun : la qualité de l’accueil conditionne leur activité, surtout pendant les vagues de chaleur.',\n236\t    sections: [\n237\t      { title: 'Pourquoi un ERP surchauffe en été', body: 'Une grande toiture sombre peut dépasser 80°C en surface et transmettre cette chaleur aux volumes occupés par le public.' },\n238\t      { title: 'Confort du public et activité', body: 'Un établissement trop chaud voit son public écourter ses visites. Le cool roof aide à maintenir une ambiance agréable pendant les fortes chaleurs.' },\n239\t      { title: 'Le cool roof selon votre établissement', body: 'Hôtels, restaurants, cinémas, salles de sport et lieux de culte bénéficient d’une baisse de charge thermique sans travaux lourds.' },\n240\t      { title: 'Maîtriser la facture de climatisation', body: 'En limitant l’apport de chaleur par le toit, le cool roof réduit la sollicitation des équipements de froid sur les grands volumes.' },\n241\t      { title: 'Décret tertiaire et prime CEE', body: 'Un ERP peut relever du décret tertiaire au-delà de 1000 m². La prime CEE BAT-EN-112 dépend de l’usage commercial et de la climatisation par pompe à chaleur.' },\n242\t      { title: 'Une protection qui dure', body: 'Les systèmes Covalba en polyuréthane avec vernis de finition sont conçus pour tenir 8 à 10 ans tout en protégeant l’étanchéité.' },\n243\t    ],\n244\t    sources: [\n245\t      'Lawrence Berkeley National Laboratory, Heat Island Group, Cool Roofs. https://heatisland.lbl.gov/coolscience/cool-roofs',\n246\t      'U.S. EPA, Using Cool Roofs to Reduce Heat Islands. https://www.epa.gov/heatislands/using-cool-roofs-reduce-heat-islands',\n247\t      'EPA, Reducing Urban Heat Islands: Compendium of Strategies, ch. 4 Cool Roofs.',\n248\t      'Dispositif Éco Énergie Tertiaire. https://rt-re-batiment.developpement-durable.gouv.fr/presentation-du-dispositif-eco-energie-tertiaire-a559.html',\n249\t      'Fiche CEE BAT-EN-112, Ministère de la Transition écologique.',\n250\t    ],\n251\t  },\n252\t};\n253\t\n254\tconst ERP = () => (\n255\t  <>\n256\t    <Navbar />\n257\t    <main>\n258\t      <SectorPageTemplate config={config} />\n259\t    </main>\n260\t    <Footer />\n261\t    <StickyMobileCTA />\n262\t  </>\n263\t);\n264\t\n265\texport default ERP;\n266\t"}]},"uuid":"b82b8204-74ce-452d-8f49-1daf598be9ce","timestamp":"2026-06-21T23:05:04.338Z","toolUseResult":{"type":"text","file":{"filePath":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/industries/ERP.tsx","content":"import Navbar from '@/components/Navbar';\nimport Footer from '@/components/Footer';\nimport StickyMobileCTA from '@/components/StickyMobileCTA';\nimport { SectorPageTemplate, type SectorPageConfig } from '@/components/industries/SectorPageTemplate';\nimport {\n  BadgeCheck,\n  Building2,\n  Church,\n  CircleDollarSign,\n  Dumbbell,\n  Film,\n  Hotel,\n  Shield,\n  Snowflake,\n  Sparkles,\n  Theater,\n  Thermometer,\n  TrendingDown,\n  UsersRound,\n  UtensilsCrossed,\n} from 'lucide-react';\n\nconst erpHeroImage = '/images/erp/erp-hero-realiste.png';\nconst erpBeforeImage = '/images/erp/erp-before.png';\nconst erpSportImage = '/images/erp/erp-salle-sport-realiste.png';\nconst erpCinemaImage = '/images/erp/erp-cinema-realiste.png';\nconst erpHotelRestaurantImage = '/images/erp/hotel-restaurant-realiste.webp';\nconst erpLieuCulteImage = '/images/erp/lieu-de-culte-realiste.webp';\n\nconst config: SectorPageConfig = {\n  slug: 'erp',\n  title: 'Cool roof ERP : -10°C pour accueillir votre public au frais',\n  description:\n    'Cool roof pour établissements recevant du public : -8 à -10°C sous toiture, public au frais et climatisation soulagée, sans fermer. Hôtels, restaurants, salles, loisirs.',\n  canonicalPath: '/industries/erp',\n  serviceName: 'Cool roof ERP',\n  serviceDescription:\n    'Solution cool roof pour établissements recevant du public privés : hôtels, restaurants, salles de réception, cinémas, salles de sport, loisirs et lieux de culte.',\n  audience: 'Exploitants, directeurs d’établissement, responsables patrimoine et techniques de groupes privés',\n  hero: {\n    eyebrow: '',\n    h1: 'Cool roof pour les établissements recevant du public',\n    sub: \"Accueillez votre public au frais tout l'été, sans pousser la climatisation à fond.\",\n    image: erpHeroImage,\n    imageAlt: 'Établissement recevant du public avec toiture cool roof blanche',\n    stats: [\n      { icon: Thermometer, value: '-8 à -10°C', label: 'sous toiture' },\n      { icon: UsersRound, value: 'Confort public', label: 'expérience préservée' },\n      { icon: BadgeCheck, value: 'Sans fermer', label: 'chantier extérieur' },\n    ],\n    formTitle: 'Votre projet ERP',\n    formSubtitle: 'Réponse personnalisée sous 48h',\n    formFields: {\n      typeLabel: \"Type d'établissement\",\n      typeOptions: ['Hôtel / hébergement', 'Restaurant', 'Salle de réception', 'Cinéma / spectacle', 'Salle de sport', 'Lieu de culte', 'Autre'],\n      climateLabel: 'Bâtiment climatisé ?',\n      climateOptions: ['Oui, pompe à chaleur', 'Oui, autre système', 'Non', 'Partiellement', 'À confirmer'],\n      yearLabel: 'Année du bâtiment',\n      microcopy: 'Éligibilité CEE étudiée · Sans fermeture',\n      cta: 'Demander un devis',\n    },\n  },\n  logos: {\n    title: 'Des établissements ouverts au public nous font confiance',\n    items: [\n      { name: 'Hôtellerie' },\n      { name: 'Loisirs' },\n      { name: 'Restauration' },\n      { name: 'Salles privées' },\n      { name: 'Événementiel' },\n    ],\n  },\n  problem: {\n    eyebrow: 'Pourquoi agir',\n    title: 'Un établissement surchauffé,',\n    mutedTitle: 'c’est un public qui ne reste pas.',\n    intro:\n      \"Hôtel, restaurant, salle de sport ou lieu de réception : la chaleur dégrade l'expérience, fait tourner la climatisation et pèse sur l'image.\",\n    transition: '',\n    cards: [\n      {\n        icon: UsersRound,\n        title: 'Le public écourte sa visite',\n        desc: 'Un public mal à l’aise reste moins longtemps et revient moins volontiers.',\n        image: erpHeroImage,\n        alt: 'Établissement hôtelier exposé à la chaleur',\n      },\n      {\n        icon: Snowflake,\n        title: 'La climatisation s’emballe',\n        desc: 'Quand la toiture chauffe, les groupes de froid tournent en continu et la facture grimpe.',\n        image: '/images/distribution/problem-climatisation.webp',\n        alt: 'Groupes de climatisation sur toiture',\n      },\n      {\n        icon: Sparkles,\n        title: 'L’image en pâtit',\n        desc: 'Un établissement étouffant l’été dégrade l’expérience et les avis en ligne.',\n        image: erpCinemaImage,\n        alt: 'Établissement recevant du public en été',\n      },\n      {\n        icon: Shield,\n        title: 'Le confort du public à assurer',\n        desc: 'Recevoir du public impose une attention particulière au confort et à la sécurité en période chaude.',\n        image: erpSportImage,\n        alt: 'Salle de sport privée exposée au soleil',\n      },\n    ],\n  },\n  solution: {\n    eyebrow: 'La solution Covalba',\n    title: 'Votre toiture renvoie',\n    mutedTitle: 'le soleil au lieu de l’absorber.',\n    intro:\n      \"Covalba applique un revêtement réfléchissant qui renvoie jusqu'à 90 % du rayonnement solaire. La toiture ne chauffe plus, l’ambiance intérieure redescend de 8 à 10°C et la climatisation est soulagée.\",\n    points: [],\n    transition: '',\n    beforeImage: erpBeforeImage,\n    afterImage: erpHeroImage,\n  },\n  durability: {\n    title: 'Le système Covalba',\n    mutedTitle: 'tient plus longtemps sur votre ERP.',\n    intro:\n      'Sur une toiture d’ERP, la performance doit durer : confort, image et facture ne peuvent pas dépendre d’une peinture qui fatigue en deux saisons.',\n    note:\n      'Les systèmes Covalba en polyuréthane avec vernis de finition sont conçus pour tenir 8 à 10 ans tout en protégeant l’étanchéité.',\n    covalbaLabel: 'Performance pensée pour les établissements ouverts',\n  },\n  special: {\n    kind: 'decret',\n    eyebrow: 'Cadre réglementaire',\n    title: 'Décret tertiaire et aides, selon votre établissement.',\n    intro:\n      'Selon l’usage et la surface de votre établissement, plusieurs leviers peuvent s’appliquer. Le cool roof contribue à la trajectoire de réduction de consommation et peut ouvrir droit à une aide selon les cas.',\n    milestones: [\n      { value: '-40 %', label: \"d'ici 2030\" },\n      { value: '-50 %', label: \"d'ici 2040\" },\n      { value: '-60 %', label: \"d'ici 2050\" },\n    ],\n    points: [\n      'Décret tertiaire au-delà de 1000 m² d’activité tertiaire',\n      'Réduction de la charge de climatisation',\n      'Prime CEE BAT-EN-112 possible pour certains ERP commerciaux climatisés par pompe à chaleur',\n      \"Éligibilité vérifiée à l'étude selon l’usage précis du bâtiment\",\n    ],\n    note:\n      \"L'éligibilité à la prime CEE dépend de l'usage précis du bâtiment et de son équipement. Covalba étudie votre cas et vous oriente vers le bon levier.\",\n    cta: 'Vérifier mon éligibilité',\n  },\n  benefits: {\n    eyebrow: 'Ce que vous y gagnez',\n    title: 'Un public au frais, une facture maîtrisée, une meilleure image.',\n    desc: 'Le cool roof améliore le confort d’accueil tout en soulageant la climatisation des grands volumes.',\n    metric: '-8 à -10°C',\n    metricLabel: 'sous votre toiture',\n    image: erpHeroImage,\n    imageAlt: 'Hôtel restaurant rafraîchi par une toiture cool roof',\n    transition: 'Au-delà du cadre, voici comment le cool roof s’adapte à chaque type d’établissement.',\n    cards: [\n      { icon: UsersRound, title: 'Un public qui reste', desc: 'Une ambiance fraîche soutient la fréquentation pendant les fortes chaleurs.' },\n      { icon: Snowflake, title: 'Climatisation soulagée', desc: 'Moins de chaleur par la toiture, c’est des groupes de froid moins sollicités.' },\n      { icon: Sparkles, title: 'Meilleure expérience', desc: 'Le confort thermique améliore satisfaction, image et avis de votre établissement.' },\n      { icon: Shield, title: 'Toiture protégée', desc: 'Le revêtement protège l’étanchéité des UV et de la chaleur.' },\n      { icon: BadgeCheck, title: 'Argument RSE', desc: 'Une action passive et sobre, valorisable dans votre démarche environnementale.' },\n    ],\n  },\n  applications: {\n    eyebrow: 'Vos établissements',\n    title: 'Une solution pour chaque établissement recevant du public.',\n    intro: 'Hébergement, restauration, spectacle, sport et accueil n’ont pas les mêmes contraintes d’usage.',\n    transition: '',\n    cards: [\n      { icon: Hotel, label: 'Hôtels', title: 'Hôtels et hébergements', desc: 'Confort des chambres et espaces communs sans sur-climatiser.', image: erpHeroImage },\n      { icon: UtensilsCrossed, label: 'Réception', title: 'Restaurants et salles', desc: 'Salles où le confort thermique fait la différence pour les clients et événements.', image: erpHotelRestaurantImage },\n      { icon: Film, label: 'Spectacle', title: 'Cinémas et spectacles', desc: 'Grands volumes où la chaleur pèse sur confort et climatisation.', image: erpCinemaImage },\n      { icon: Dumbbell, label: 'Loisirs', title: 'Salles de sport et loisirs', desc: 'Espaces vite étouffants l’été, même avec ventilation.', image: erpSportImage },\n      { icon: Church, label: 'Accueil', title: 'Lieux de culte et accueil', desc: 'Grands volumes rarement climatisés où le cool roof améliore nettement le confort.', image: erpLieuCulteImage },\n    ],\n  },\n  method: {\n    eyebrow: 'Chantier en sécurité',\n    title: '4 étapes.',\n    mutedTitle: 'Sans fermeture.',\n    intro:\n      \"Tout se passe depuis l'extérieur. L'intervention est organisée autour de vos horaires et de l'accueil du public.\",\n    duration: \"Durée moyenne : 2 à 5 jours · Sans fermeture de l'établissement\",\n    steps: [\n      { title: 'Diagnostic', text: 'État de la toiture, type de support, objectifs de confort.' },\n      { title: 'Préparation', text: 'Nettoyage adapté et reprise des points sensibles.' },\n      { title: 'Application sécurisée', text: \"Projection depuis l'extérieur, organisée autour de votre accueil du public.\" },\n      { title: 'Contrôle', text: 'Vérification de la qualité et suivi dans le temps.' },\n    ],\n  },\n  proof: {\n    eyebrow: 'Des résultats concrets',\n    title: 'Mesuré',\n    mutedTitle: 'sur le terrain.',\n    intro: 'Les résultats dépendent du support, de l’isolation et du niveau de climatisation existant.',\n    figures: [\n      { icon: TrendingDown, value: '-7,5°C', label: 'sur la température de surface' },\n      { icon: CircleDollarSign, value: '-20 %', label: 'sur la facture de climatisation, si équipée' },\n      { icon: BadgeCheck, value: '8-10 ans', label: 'de tenue du revêtement' },\n    ],\n    logos: [\n      { name: 'Hôtellerie' },\n      { name: 'Loisirs' },\n      { name: 'Restauration' },\n      { name: 'Événementiel' },\n    ],\n    transition: 'Avant de lancer votre projet, voici les questions les plus fréquentes.',\n  },\n  faq: {\n    intro: 'Les questions qui reviennent le plus souvent chez les exploitants et responsables techniques.',\n    items: [\n      { q: 'Le chantier va-t-il fermer mon établissement ?', a: \"Non. Toute l'application se fait depuis l'extérieur. Votre établissement continue d'accueillir le public, et l'intervention est organisée autour de vos horaires.\" },\n      { q: 'Quel gain pour le confort de mon public ?', a: 'En abaissant la température sous toiture, le cool roof rend l’ambiance plus agréable l’été, ce qui retient la clientèle et améliore l’expérience.' },\n      { q: 'Mon établissement est-il éligible à une aide ?', a: 'Cela dépend de son usage et de sa surface. Un ERP commercial climatisé peut relever de la prime CEE, un établissement tertiaire de plus de 1000 m² est concerné par le décret tertiaire.' },\n      { q: 'Le cool roof réduit-il ma facture de climatisation ?', a: 'Oui. En limitant la chaleur transmise par la toiture, vos groupes de froid travaillent moins, particulièrement sur les grands volumes.' },\n      { q: \"Ça marche si mon établissement n'est pas climatisé ?\", a: 'Oui. Le bénéfice se mesure alors en confort : la toiture transmet moins de chaleur et l’ambiance reste plus supportable.' },\n      { q: 'Et l’hiver ?', a: 'L’effet est minime. Le soleil d’hiver est bas et peu présent. La légère perte d’intersaison est largement compensée par le gain d’été.' },\n    ],\n  },\n  finalCta: {\n    eyebrow: 'Cool roof ERP',\n    title: 'Offrez à votre public un établissement au frais.',\n    desc: 'Demandez un devis et découvrez le potentiel de votre toiture, pour le confort de votre public, votre facture et votre image.',\n    reassurances: ['Étude sous 48h', 'Sans fermeture', 'Sans engagement'],\n  },\n  seo: {\n    eyebrow: 'Dossier ERP',\n    title: 'Cool roof ERP : confort du public, climatisation et cadre applicable.',\n    intro:\n      'Les établissements recevant du public ont un point commun : la qualité de l’accueil conditionne leur activité, surtout pendant les vagues de chaleur.',\n    sections: [\n      { title: 'Pourquoi un ERP surchauffe en été', body: 'Une grande toiture sombre peut dépasser 80°C en surface et transmettre cette chaleur aux volumes occupés par le public.' },\n      { title: 'Confort du public et activité', body: 'Un établissement trop chaud voit son public écourter ses visites. Le cool roof aide à maintenir une ambiance agréable pendant les fortes chaleurs.' },\n      { title: 'Le cool roof selon votre établissement', body: 'Hôtels, restaurants, cinémas, salles de sport et lieux de culte bénéficient d’une baisse de charge thermique sans travaux lourds.' },\n      { title: 'Maîtriser la facture de climatisation', body: 'En limitant l’apport de chaleur par le toit, le cool roof réduit la sollicitation des équipements de froid sur les grands volumes.' },\n      { title: 'Décret tertiaire et prime CEE', body: 'Un ERP peut relever du décret tertiaire au-delà de 1000 m². La prime CEE BAT-EN-112 dépend de l’usage commercial et de la climatisation par pompe à chaleur.' },\n      { title: 'Une protection qui dure', body: 'Les systèmes Covalba en polyuréthane avec vernis de finition sont conçus pour tenir 8 à 10 ans tout en protégeant l’étanchéité.' },\n    ],\n    sources: [\n      'Lawrence Berkeley National Laboratory, Heat Island Group, Cool Roofs. https://heatisland.lbl.gov/coolscience/cool-roofs',\n      'U.S. EPA, Using Cool Roofs to Reduce Heat Islands. https://www.epa.gov/heatislands/using-cool-roofs-reduce-heat-islands',\n      'EPA, Reducing Urban Heat Islands: Compendium of Strategies, ch. 4 Cool Roofs.',\n      'Dispositif Éco Énergie Tertiaire. https://rt-re-batiment.developpement-durable.gouv.fr/presentation-du-dispositif-eco-energie-tertiaire-a559.html',\n      'Fiche CEE BAT-EN-112, Ministère de la Transition écologique.',\n    ],\n  },\n};\n\nconst ERP = () => (\n  <>\n    <Navbar />\n    <main>\n      <SectorPageTemplate config={config} />\n    </main>\n    <Footer />\n    <StickyMobileCTA />\n  </>\n);\n\nexport default ERP;\n","numLines":266,"startLine":1,"totalLines":266}},"sourceToolAssistantUUID":"6232dcce-a2c3-46f3-a28b-53d62e872a10","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"b82b8204-74ce-452d-8f49-1daf598be9ce","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01Fa4nxbdRwBybNNXiDqmrAm","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01S3vv65VBsHFXbrKXyMBMtd","name":"Read","input":{"file_path":"/tmp/covalba-en-sectors/public-venues.en.md"},"caller":{"type":"direct"}}],"stop_reason":"tool_use","stop_sequence":null,"stop_details":null,"usage":{"input_tokens":23595,"cache_creation_input_tokens":9324,"cache_read_input_tokens":5704,"output_tokens":180,"server_tool_use":{"web_search_requests":0,"web_fetch_requests":0},"service_tier":"standard","cache_creation":{"ephemeral_1h_input_tokens":0,"ephemeral_5m_input_tokens":9324},"inference_geo":"not_available","iterations":[{"input_tokens":23595,"output_tokens":180,"cache_read_input_tokens":5704,"cache_creation_input_tokens":9324,"cache_creation":{"ephemeral_5m_input_tokens":9324,"ephemeral_1h_input_tokens":0},"type":"message"}],"speed":"standard"},"diagnostics":null},"requestId":"req_011CcHEzV9HwUT2BFhFfAPRM","attributionAgent":"general-purpose","type":"assistant","uuid":"4d4686bb-2bd1-434a-b4e6-d5849f17e8d8","timestamp":"2026-06-21T23:05:04.541Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"4d4686bb-2bd1-434a-b4e6-d5849f17e8d8","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_01S3vv65VBsHFXbrKXyMBMtd","type":"tool_result","content":"1\t## [meta] SEO Metadata\n2\t- [title] Cool roof for public venues: -10°C to keep your guests cool\n3\t- [description] Reflective roof coating for public venues: -8 to -10°C under the roof, guests kept cool and less strain on your air conditioning, with no closure. Hotels, restaurants, event halls, leisure.\n4\t- [service-name] Cool roof for public venues\n5\t- [service-description] Reflective cool roof coating for public venues: hotels, restaurants, event halls, cinemas, gyms, leisure facilities and places of worship.\n6\t- [audience] Operators, venue managers, asset and facility managers of sites open to the public\n7\t\n8\t## [hero] Hero banner\n9\t- [h1] Cool roof for public venues\n10\t- [sub] Keep your guests cool all summer long, without running your air conditioning at full blast.\n11\t- [image-alt] Public venue with a white cool roof coating\n12\t- [stat-1-value] -8 to -10°C\n13\t- [stat-1-label] under the roof\n14\t- [stat-2-value] Guest comfort\n15\t- [stat-2-label] experience preserved\n16\t- [stat-3-value] No closure\n17\t- [stat-3-label] exterior work\n18\t- [form-title] Your public venue project\n19\t- [form-subtitle] Personalized response within 48h\n20\t- [form-type-label] Type of venue\n21\t- [form-type-option-1] Hotel / accommodation\n22\t- [form-type-option-2] Restaurant\n23\t- [form-type-option-3] Event hall\n24\t- [form-type-option-4] Cinema / live entertainment\n25\t- [form-type-option-5] Gym\n26\t- [form-type-option-6] Place of worship\n27\t- [form-type-option-7] Other\n28\t- [form-climate-label] Air-conditioned building?\n29\t- [form-climate-option-1] Yes, heat pump\n30\t- [form-climate-option-2] Yes, other system\n31\t- [form-climate-option-3] No\n32\t- [form-climate-option-4] Partially\n33\t- [form-climate-option-5] To be confirmed\n34\t- [form-year-label] Year of construction\n35\t- [form-microcopy] No site closure\n36\t- [form-cta] Request a quote\n37\t\n38\t## [logos] Trust banner\n39\t- [title] Venues open to the public trust us\n40\t- [item-1] Hospitality\n41\t- [item-2] Leisure\n42\t- [item-3] Dining\n43\t- [item-4] Private venues\n44\t- [item-5] Events\n45\t\n46\t## [problem] The problem\n47\t- [eyebrow] Why act now\n48\t- [title] An overheated venue\n49\t- [muted-title] means guests who don't stay.\n50\t- [intro] Hotel, restaurant, gym or event hall: heat degrades the experience, keeps the air conditioning running and hurts your image.\n51\t- [card-1-title] Guests cut their visit short\n52\t- [card-1-desc] Uncomfortable guests stay for less time and are less likely to return.\n53\t- [card-1-alt] Hotel venue exposed to heat\n54\t- [card-2-title] Air conditioning works overtime\n55\t- [card-2-desc] When the roof heats up, the cooling units run nonstop and the bill climbs.\n56\t- [card-2-alt] Air conditioning units on a roof\n57\t- [card-3-title] Your image suffers\n58\t- [card-3-desc] A venue that's stifling in summer degrades the experience and your online reviews.\n59\t- [card-3-alt] Public venue in summer\n60\t- [card-4-title] Guest comfort at stake\n61\t- [card-4-desc] Welcoming the public calls for special attention to comfort and safety during hot weather.\n62\t- [card-4-alt] Private gym exposed to the sun\n63\t\n64\t## [solution] The solution\n65\t- [eyebrow] The Covalba solution\n66\t- [title] Your roof reflects\n67\t- [muted-title] the sun instead of absorbing it.\n68\t- [intro] Covalba manufactures a reflective cool roof coating that reflects up to 90% of solar radiation. Applied by your roofing contractor, it keeps the roof from heating up: the indoor environment drops by 8 to 10°C and the load on your air conditioning eases.\n69\t\n70\t## [durability] Durability\n71\t- [title] The Covalba system\n72\t- [muted-title] lasts longer on your roof.\n73\t- [intro] On the roof of a public venue, performance has to last: comfort, image and energy bills can't depend on a coating that wears out in two seasons.\n74\t- [note] Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.\n75\t- [covalba-label] Performance engineered for venues open to the public\n76\t\n77\t## [benefits] Benefits\n78\t- [eyebrow] What you gain\n79\t- [title] Cool guests, lower bills, a better image.\n80\t- [desc] The cool roof improves guest comfort while easing the cooling load in large open spaces.\n81\t- [metric] -8 to -10°C\n82\t- [metric-label] under your roof\n83\t- [image-alt] Hotel restaurant cooled by a cool roof coating\n84\t- [transition] Beyond the benefits, here's how the cool roof adapts to each type of venue.\n85\t- [card-1-title] Guests who stay\n86\t- [card-1-desc] A cool environment keeps people coming through heatwaves.\n87\t- [card-2-title] Less strain on your AC\n88\t- [card-2-desc] Less heat through the roof means your cooling units work less hard.\n89\t- [card-3-title] Better experience\n90\t- [card-3-desc] Thermal comfort improves satisfaction, image and reviews for your venue.\n91\t- [card-4-title] Protected roof\n92\t- [card-4-desc] The coating protects the waterproofing from UV and heat.\n93\t- [card-5-title] ESG selling point\n94\t- [card-5-desc] A passive, low-impact measure you can highlight in your environmental commitments.\n95\t\n96\t## [applications] Applications\n97\t- [eyebrow] Your venues\n98\t- [title] A solution for every public venue.\n99\t- [intro] Accommodation, food service, entertainment, sports and hospitality don't share the same usage constraints.\n100\t- [card-1-label] Hotels\n101\t- [card-1-title] Hotels and accommodation\n102\t- [card-1-desc] Comfort in rooms and common areas without over-cooling.\n103\t- [card-2-label] Dining\n104\t- [card-2-title] Restaurants and event halls\n105\t- [card-2-desc] Spaces where thermal comfort makes the difference for guests and events.\n106\t- [card-3-label] Entertainment\n107\t- [card-3-title] Cinemas and live entertainment\n108\t- [card-3-desc] Large spaces where heat strains both comfort and air conditioning.\n109\t- [card-4-label] Leisure\n110\t- [card-4-title] Gyms and leisure facilities\n111\t- [card-4-desc] Spaces that quickly become stifling in summer, even with ventilation.\n112\t- [card-5-label] Community\n113\t- [card-5-title] Places of worship and community venues\n114\t- [card-5-desc] Large spaces that are rarely air-conditioned, where the cool roof clearly improves comfort.\n115\t\n116\t## [method] Project method\n117\t- [eyebrow] Safe project execution\n118\t- [title] 4 steps.\n119\t- [muted-title] No closure.\n120\t- [intro] Everything happens from the outside. The work you entrust to your roofing contractor is organized around your operating hours and the flow of your guests.\n121\t- [duration] Average duration: 2 to 5 days · No closure of the venue\n122\t- [step-1-title] Assessment\n123\t- [step-1-text] Roof condition, deck type, comfort objectives.\n124\t- [step-2-title] Preparation\n125\t- [step-2-text] Suitable cleaning and repair of sensitive points.\n126\t- [step-3-title] Safe application\n127\t- [step-3-text] Spray application from the outside, organized around your operating hours and guests.\n128\t- [step-4-title] Inspection\n129\t- [step-4-text] Quality verification and monitoring over time.\n130\t\n131\t## [proof] Proof\n132\t- [eyebrow] Concrete results\n133\t- [title] Measured\n134\t- [muted-title] in the field.\n135\t- [intro] Results depend on the roof type, the insulation and the existing level of air conditioning.\n136\t- [figure-1-value] -7.5°C\n137\t- [figure-1-label] on surface temperature\n138\t- [figure-2-value] -20%\n139\t- [figure-2-label] on cooling costs (if air-conditioned)\n140\t- [figure-3-value] 8-10 years\n141\t- [figure-3-label] of coating durability\n142\t- [logo-1] Hospitality\n143\t- [logo-2] Leisure\n144\t- [logo-3] Dining\n145\t- [logo-4] Events\n146\t- [transition] Before launching your project, here are the most frequently asked questions.\n147\t\n148\t## [faq] Frequently asked questions\n149\t- [intro] The questions that come up most often among operators and facility managers.\n150\t- [q1-question] Will the work close my venue?\n151\t- [q1-answer] No. The entire application is carried out from the outside. Your venue keeps welcoming the public, and the work is organized around your operating hours.\n152\t- [q2-question] What's the gain for my guests' comfort?\n153\t- [q2-answer] By lowering the temperature under the roof, the cool roof makes the environment more pleasant in summer, which keeps guests longer and improves their experience.\n154\t- [q3-question] Does the cool roof reduce my air conditioning bill?\n155\t- [q3-answer] Yes. By limiting the heat transmitted through the roof, your cooling units work less, especially in large open spaces.\n156\t- [q4-question] Does it work if my venue isn't air-conditioned?\n157\t- [q4-answer] Yes. The benefit is then measured in comfort: the roof transmits less heat and the environment stays more bearable.\n158\t- [q5-question] What about winter?\n159\t- [q5-answer] The effect is minimal. The winter sun is low and rarely out. The slight off-season loss is largely offset by the summer gain.\n160\t- [q6-question] Who applies the coating?\n161\t- [q6-answer] Covalba manufactures the coating; you have it applied by your roofing contractor or a professional applicator. We provide the technical data sheets and application recommendations to guarantee the result.\n162\t\n163\t## [final-cta] Final call to action\n164\t- [eyebrow] Cool roof for public venues\n165\t- [title] Give your guests a venue that stays cool.\n166\t- [desc] Request a quote and discover your roof's potential, for your guests' comfort, your energy bills and your image.\n167\t- [reassurance-1] Assessment within 48h\n168\t- [reassurance-2] No closure\n169\t- [reassurance-3] No commitment\n170\t\n171\t## [seo] SEO content\n172\t- [eyebrow] Public venues dossier\n173\t- [title] Cool roof for public venues: guest comfort and air conditioning.\n174\t- [intro] Public venues share one thing in common: the quality of the guest experience drives their business, especially during heatwaves.\n175\t- [section-1-title] Why a venue overheats in summer\n176\t- [section-1-body] A large dark roof can exceed 80°C at the surface and transmit that heat to the spaces occupied by the public.\n177\t- [section-2-title] Guest comfort and business\n178\t- [section-2-body] A venue that's too hot sees guests cut their visits short. The cool roof helps maintain a pleasant environment during heatwaves.\n179\t- [section-3-title] The cool roof by venue type\n180\t- [section-3-body] Hotels, restaurants, cinemas, gyms and places of worship benefit from a reduced thermal load without heavy works.\n181\t- [section-4-title] Controlling the air conditioning bill\n182\t- [section-4-body] By limiting heat gain through the roof, the cool roof reduces the strain on cooling equipment in large open spaces.\n183\t- [section-5-title] Protection that lasts\n184\t- [section-5-body] Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.\n185\t- [source-1] Lawrence Berkeley National Laboratory, Heat Island Group, Cool Roofs. https://heatisland.lbl.gov/coolscience/cool-roofs\n186\t- [source-2] U.S. EPA, Using Cool Roofs to Reduce Heat Islands. https://www.epa.gov/heatislands/using-cool-roofs-reduce-heat-islands\n187\t- [source-3] EPA, Reducing Urban Heat Islands: Compendium of Strategies, ch. 4 Cool Roofs."}]},"uuid":"6145d8f9-b5ea-4155-a19f-fd0e0bfd0b43","timestamp":"2026-06-21T23:05:04.581Z","toolUseResult":{"type":"text","file":{"filePath":"/tmp/covalba-en-sectors/public-venues.en.md","content":"## [meta] SEO Metadata\n- [title] Cool roof for public venues: -10°C to keep your guests cool\n- [description] Reflective roof coating for public venues: -8 to -10°C under the roof, guests kept cool and less strain on your air conditioning, with no closure. Hotels, restaurants, event halls, leisure.\n- [service-name] Cool roof for public venues\n- [service-description] Reflective cool roof coating for public venues: hotels, restaurants, event halls, cinemas, gyms, leisure facilities and places of worship.\n- [audience] Operators, venue managers, asset and facility managers of sites open to the public\n\n## [hero] Hero banner\n- [h1] Cool roof for public venues\n- [sub] Keep your guests cool all summer long, without running your air conditioning at full blast.\n- [image-alt] Public venue with a white cool roof coating\n- [stat-1-value] -8 to -10°C\n- [stat-1-label] under the roof\n- [stat-2-value] Guest comfort\n- [stat-2-label] experience preserved\n- [stat-3-value] No closure\n- [stat-3-label] exterior work\n- [form-title] Your public venue project\n- [form-subtitle] Personalized response within 48h\n- [form-type-label] Type of venue\n- [form-type-option-1] Hotel / accommodation\n- [form-type-option-2] Restaurant\n- [form-type-option-3] Event hall\n- [form-type-option-4] Cinema / live entertainment\n- [form-type-option-5] Gym\n- [form-type-option-6] Place of worship\n- [form-type-option-7] Other\n- [form-climate-label] Air-conditioned building?\n- [form-climate-option-1] Yes, heat pump\n- [form-climate-option-2] Yes, other system\n- [form-climate-option-3] No\n- [form-climate-option-4] Partially\n- [form-climate-option-5] To be confirmed\n- [form-year-label] Year of construction\n- [form-microcopy] No site closure\n- [form-cta] Request a quote\n\n## [logos] Trust banner\n- [title] Venues open to the public trust us\n- [item-1] Hospitality\n- [item-2] Leisure\n- [item-3] Dining\n- [item-4] Private venues\n- [item-5] Events\n\n## [problem] The problem\n- [eyebrow] Why act now\n- [title] An overheated venue\n- [muted-title] means guests who don't stay.\n- [intro] Hotel, restaurant, gym or event hall: heat degrades the experience, keeps the air conditioning running and hurts your image.\n- [card-1-title] Guests cut their visit short\n- [card-1-desc] Uncomfortable guests stay for less time and are less likely to return.\n- [card-1-alt] Hotel venue exposed to heat\n- [card-2-title] Air conditioning works overtime\n- [card-2-desc] When the roof heats up, the cooling units run nonstop and the bill climbs.\n- [card-2-alt] Air conditioning units on a roof\n- [card-3-title] Your image suffers\n- [card-3-desc] A venue that's stifling in summer degrades the experience and your online reviews.\n- [card-3-alt] Public venue in summer\n- [card-4-title] Guest comfort at stake\n- [card-4-desc] Welcoming the public calls for special attention to comfort and safety during hot weather.\n- [card-4-alt] Private gym exposed to the sun\n\n## [solution] The solution\n- [eyebrow] The Covalba solution\n- [title] Your roof reflects\n- [muted-title] the sun instead of absorbing it.\n- [intro] Covalba manufactures a reflective cool roof coating that reflects up to 90% of solar radiation. Applied by your roofing contractor, it keeps the roof from heating up: the indoor environment drops by 8 to 10°C and the load on your air conditioning eases.\n\n## [durability] Durability\n- [title] The Covalba system\n- [muted-title] lasts longer on your roof.\n- [intro] On the roof of a public venue, performance has to last: comfort, image and energy bills can't depend on a coating that wears out in two seasons.\n- [note] Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.\n- [covalba-label] Performance engineered for venues open to the public\n\n## [benefits] Benefits\n- [eyebrow] What you gain\n- [title] Cool guests, lower bills, a better image.\n- [desc] The cool roof improves guest comfort while easing the cooling load in large open spaces.\n- [metric] -8 to -10°C\n- [metric-label] under your roof\n- [image-alt] Hotel restaurant cooled by a cool roof coating\n- [transition] Beyond the benefits, here's how the cool roof adapts to each type of venue.\n- [card-1-title] Guests who stay\n- [card-1-desc] A cool environment keeps people coming through heatwaves.\n- [card-2-title] Less strain on your AC\n- [card-2-desc] Less heat through the roof means your cooling units work less hard.\n- [card-3-title] Better experience\n- [card-3-desc] Thermal comfort improves satisfaction, image and reviews for your venue.\n- [card-4-title] Protected roof\n- [card-4-desc] The coating protects the waterproofing from UV and heat.\n- [card-5-title] ESG selling point\n- [card-5-desc] A passive, low-impact measure you can highlight in your environmental commitments.\n\n## [applications] Applications\n- [eyebrow] Your venues\n- [title] A solution for every public venue.\n- [intro] Accommodation, food service, entertainment, sports and hospitality don't share the same usage constraints.\n- [card-1-label] Hotels\n- [card-1-title] Hotels and accommodation\n- [card-1-desc] Comfort in rooms and common areas without over-cooling.\n- [card-2-label] Dining\n- [card-2-title] Restaurants and event halls\n- [card-2-desc] Spaces where thermal comfort makes the difference for guests and events.\n- [card-3-label] Entertainment\n- [card-3-title] Cinemas and live entertainment\n- [card-3-desc] Large spaces where heat strains both comfort and air conditioning.\n- [card-4-label] Leisure\n- [card-4-title] Gyms and leisure facilities\n- [card-4-desc] Spaces that quickly become stifling in summer, even with ventilation.\n- [card-5-label] Community\n- [card-5-title] Places of worship and community venues\n- [card-5-desc] Large spaces that are rarely air-conditioned, where the cool roof clearly improves comfort.\n\n## [method] Project method\n- [eyebrow] Safe project execution\n- [title] 4 steps.\n- [muted-title] No closure.\n- [intro] Everything happens from the outside. The work you entrust to your roofing contractor is organized around your operating hours and the flow of your guests.\n- [duration] Average duration: 2 to 5 days · No closure of the venue\n- [step-1-title] Assessment\n- [step-1-text] Roof condition, deck type, comfort objectives.\n- [step-2-title] Preparation\n- [step-2-text] Suitable cleaning and repair of sensitive points.\n- [step-3-title] Safe application\n- [step-3-text] Spray application from the outside, organized around your operating hours and guests.\n- [step-4-title] Inspection\n- [step-4-text] Quality verification and monitoring over time.\n\n## [proof] Proof\n- [eyebrow] Concrete results\n- [title] Measured\n- [muted-title] in the field.\n- [intro] Results depend on the roof type, the insulation and the existing level of air conditioning.\n- [figure-1-value] -7.5°C\n- [figure-1-label] on surface temperature\n- [figure-2-value] -20%\n- [figure-2-label] on cooling costs (if air-conditioned)\n- [figure-3-value] 8-10 years\n- [figure-3-label] of coating durability\n- [logo-1] Hospitality\n- [logo-2] Leisure\n- [logo-3] Dining\n- [logo-4] Events\n- [transition] Before launching your project, here are the most frequently asked questions.\n\n## [faq] Frequently asked questions\n- [intro] The questions that come up most often among operators and facility managers.\n- [q1-question] Will the work close my venue?\n- [q1-answer] No. The entire application is carried out from the outside. Your venue keeps welcoming the public, and the work is organized around your operating hours.\n- [q2-question] What's the gain for my guests' comfort?\n- [q2-answer] By lowering the temperature under the roof, the cool roof makes the environment more pleasant in summer, which keeps guests longer and improves their experience.\n- [q3-question] Does the cool roof reduce my air conditioning bill?\n- [q3-answer] Yes. By limiting the heat transmitted through the roof, your cooling units work less, especially in large open spaces.\n- [q4-question] Does it work if my venue isn't air-conditioned?\n- [q4-answer] Yes. The benefit is then measured in comfort: the roof transmits less heat and the environment stays more bearable.\n- [q5-question] What about winter?\n- [q5-answer] The effect is minimal. The winter sun is low and rarely out. The slight off-season loss is largely offset by the summer gain.\n- [q6-question] Who applies the coating?\n- [q6-answer] Covalba manufactures the coating; you have it applied by your roofing contractor or a professional applicator. We provide the technical data sheets and application recommendations to guarantee the result.\n\n## [final-cta] Final call to action\n- [eyebrow] Cool roof for public venues\n- [title] Give your guests a venue that stays cool.\n- [desc] Request a quote and discover your roof's potential, for your guests' comfort, your energy bills and your image.\n- [reassurance-1] Assessment within 48h\n- [reassurance-2] No closure\n- [reassurance-3] No commitment\n\n## [seo] SEO content\n- [eyebrow] Public venues dossier\n- [title] Cool roof for public venues: guest comfort and air conditioning.\n- [intro] Public venues share one thing in common: the quality of the guest experience drives their business, especially during heatwaves.\n- [section-1-title] Why a venue overheats in summer\n- [section-1-body] A large dark roof can exceed 80°C at the surface and transmit that heat to the spaces occupied by the public.\n- [section-2-title] Guest comfort and business\n- [section-2-body] A venue that's too hot sees guests cut their visits short. The cool roof helps maintain a pleasant environment during heatwaves.\n- [section-3-title] The cool roof by venue type\n- [section-3-body] Hotels, restaurants, cinemas, gyms and places of worship benefit from a reduced thermal load without heavy works.\n- [section-4-title] Controlling the air conditioning bill\n- [section-4-body] By limiting heat gain through the roof, the cool roof reduces the strain on cooling equipment in large open spaces.\n- [section-5-title] Protection that lasts\n- [section-5-body] Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.\n- [source-1] Lawrence Berkeley National Laboratory, Heat Island Group, Cool Roofs. https://heatisland.lbl.gov/coolscience/cool-roofs\n- [source-2] U.S. EPA, Using Cool Roofs to Reduce Heat Islands. https://www.epa.gov/heatislands/using-cool-roofs-reduce-heat-islands\n- [source-3] EPA, Reducing Urban Heat Islands: Compendium of Strategies, ch. 4 Cool Roofs.","numLines":187,"startLine":1,"totalLines":187}},"sourceToolAssistantUUID":"4d4686bb-2bd1-434a-b4e6-d5849f17e8d8","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"6145d8f9-b5ea-4155-a19f-fd0e0bfd0b43","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01BnJiZeCo49erGM1LoKzh5Y","type":"message","role":"assistant","content":[{"type":"text","text":"Now let me read the EN template and the EN reference page for chrome/meta conventions."}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2756,"cache_creation_input_tokens":35005,"cache_read_input_tokens":15028,"cache_creation":{"ephemeral_5m_input_tokens":35005,"ephemeral_1h_input_tokens":0},"output_tokens":5,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHEzjcgyZ62mEGkzjWnB","attributionAgent":"general-purpose","type":"assistant","uuid":"1eb10586-0696-45fd-99bd-38285483b542","timestamp":"2026-06-21T23:05:07.582Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"1eb10586-0696-45fd-99bd-38285483b542","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01BnJiZeCo49erGM1LoKzh5Y","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_012RNo4E1QH9NH9BVwoTm7i4","name":"Read","input":{"file_path":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/en/CommercialEN.tsx"},"caller":{"type":"direct"}}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2756,"cache_creation_input_tokens":35005,"cache_read_input_tokens":15028,"cache_creation":{"ephemeral_5m_input_tokens":35005,"ephemeral_1h_input_tokens":0},"output_tokens":5,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHEzjcgyZ62mEGkzjWnB","attributionAgent":"general-purpose","type":"assistant","uuid":"d16105d8-8080-48a8-a62a-d8bd4e3470f4","timestamp":"2026-06-21T23:05:08.468Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"d16105d8-8080-48a8-a62a-d8bd4e3470f4","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_012RNo4E1QH9NH9BVwoTm7i4","type":"tool_result","content":"1\timport { useState } from 'react';\n2\timport {\n3\t  ArrowRight,\n4\t  BadgeCheck,\n5\t  BriefcaseBusiness,\n6\t  Building2,\n7\t  CalendarCheck,\n8\t  CalendarClock,\n9\t  ChartNoAxesCombined,\n10\t  Check,\n11\t  CheckCircle2,\n12\t  ClipboardCheck,\n13\t  Flame,\n14\t  Handshake,\n15\t  Landmark,\n16\t  MonitorUp,\n17\t  Play,\n18\t  Shield,\n19\t  Snowflake,\n20\t  Sparkles,\n21\t  Thermometer,\n22\t  TrendingDown,\n23\t  UsersRound,\n24\t  X,\n25\t  type LucideIcon,\n26\t} from 'lucide-react';\n27\timport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';\n28\timport { Dialog, DialogContent } from '@/components/ui/dialog';\n29\timport ScrollReveal from '@/components/ScrollReveal';\n30\timport { useJsonLd, usePageMeta } from '@/hooks/usePageMeta';\n31\timport classicRoofImage from '@/assets/industrie/logistique-solution-classic.webp';\n32\timport coolRoofImage from '@/assets/industrie/logistique-solution-coolroof.webp';\n33\timport NavbarEN from '@/components/en/NavbarEN';\n34\timport FooterEN from '@/components/en/FooterEN';\n35\timport StickyMobileCTAEN from '@/components/en/StickyMobileCTAEN';\n36\t\n37\tconst SITE_URL = 'https://www.covalba.fr';\n38\tconst SLUG = 'commercial';\n39\tconst CANONICAL = `${SITE_URL}/en/industries/commercial`;\n40\t\n41\tconst tertiaireImage = '/images/tertiaire/hero-bureaux.webp';\n42\tconst tertiaireOpenSpaceImage = '/images/tertiaire/open-space-chaleur.webp';\n43\tconst tertiaireShowroomImage = '/images/tertiaire/showroom-coolroof.webp';\n44\t\n45\ttype Logo = { name: string; url?: string };\n46\ttype HeroStat = { icon: LucideIcon; value: string; label: string };\n47\ttype ProblemCard = { icon: LucideIcon; title: string; desc: string; image: string; alt: string };\n48\ttype Benefit = { icon: LucideIcon; title: string; desc: string };\n49\ttype Application = { icon: LucideIcon; label: string; title: string; desc: string; image: string };\n50\ttype Figure = { icon: LucideIcon; value: string; label: string };\n51\ttype Faq = { q: string; a: string };\n52\ttype SeoSection = { title: string; body: string };\n53\t\n54\tconst content = {\n55\t  meta: {\n56\t    title: 'Cool roof for offices and commercial buildings: -10°C under the roof | Covalba',\n57\t    description:\n58\t      'Reflective roof coating for offices and commercial buildings: up to -10°C under the roof and -20% on cooling. Team comfort and asset value, without major works.',\n59\t    serviceName: 'Cool roof for offices and commercial buildings',\n60\t    serviceDescription:\n61\t      'Reflective roof coating for offices, headquarters, open-plan spaces and existing commercial buildings: employee comfort, less strain on air conditioning and stronger asset value.',\n62\t    audience: 'Real estate directors, facility managers, general services managers and CSR managers',\n63\t  },\n64\t  hero: {\n65\t    eyebrow: 'Commercial cool roof',\n66\t    h1: 'Cool roof for offices and commercial buildings',\n67\t    sub: 'Keep your offices cool all summer: employees stay comfortable, less strain on air conditioning, energy costs under control.',\n68\t    image: tertiaireImage,\n69\t    imageAlt: 'Modern commercial building exposed to the sun',\n70\t    stats: [\n71\t      { icon: Thermometer, value: '-8 to -10°C', label: 'under the roof' },\n72\t      { icon: Snowflake, value: '-20%', label: 'cooling bill' },\n73\t      { icon: BadgeCheck, value: 'Asset value', label: 'tangible benefit' },\n74\t    ] as HeroStat[],\n75\t    formTitle: 'Request a quote',\n76\t    formSubtitle: 'Personalized response within 24 hours',\n77\t    formFields: {\n78\t      typeLabel: 'Building type',\n79\t      typeOptions: ['Headquarters', 'Office building', 'Open-plan space', 'Showroom', 'Other'],\n80\t      climateLabel: 'Air-conditioned building?',\n81\t      climateOptions: ['Yes', 'No', 'Partially', 'To be confirmed'],\n82\t      yearLabel: 'Year built',\n83\t      microcopy: 'No commitment · Assessment tailored to offices',\n84\t      cta: 'Request a quote',\n85\t    },\n86\t  },\n87\t  logos: {\n88\t    title: 'Office and commercial building owners already trust us',\n89\t  },\n90\t  problem: {\n91\t    eyebrow: 'Why act',\n92\t    title: 'The heat is',\n93\t    mutedTitle: 'wearing down your teams.',\n94\t    intro: 'Top floors overheat, air conditioning runs hard, and working conditions deteriorate during summer peaks.',\n95\t    transition: 'All these problems share a common cause: a roof that absorbs heat instead of reflecting it.',\n96\t    cards: [\n97\t      {\n98\t        icon: UsersRound,\n99\t        title: 'Employees suffering in the heat',\n100\t        desc: 'Above 28-30°C, comfort, concentration and well-being drop.',\n101\t        image: tertiaireImage,\n102\t        alt: 'Office floor exposed to heat',\n103\t      },\n104\t      {\n105\t        icon: Flame,\n106\t        title: 'Unlivable floors under the roof',\n107\t        desc: 'Top floors become hard to occupy during summer peaks.',\n108\t        image: tertiaireOpenSpaceImage,\n109\t        alt: 'Teams in a hot workspace',\n110\t      },\n111\t      {\n112\t        icon: Snowflake,\n113\t        title: 'Air conditioning under pressure',\n114\t        desc: 'Units run at full capacity to hold the setpoint.',\n115\t        image: '/images/distribution/problem-climatisation.webp',\n116\t        alt: 'Air conditioning units on a roof',\n117\t      },\n118\t      {\n119\t        icon: Landmark,\n120\t        title: 'Rising energy costs',\n121\t        desc: 'Across large surfaces, the cooling bill weighs heavily every summer.',\n122\t        image: tertiaireImage,\n123\t        alt: 'Light-colored, durable commercial roof',\n124\t      },\n125\t    ] as ProblemCard[],\n126\t  },\n127\t  solution: {\n128\t    eyebrow: 'The Covalba solution',\n129\t    title: 'Your roof reflects',\n130\t    mutedTitle: 'instead of heating up.',\n131\t    intro: 'A cool roof coating addresses the cause: a light-colored surface reflects radiation before it reaches the offices.',\n132\t    points: [\n133\t      'Passive solution, with no energy consumption',\n134\t      'Applied from the outside, without interrupting activity',\n135\t      'Compatible with steel deck, bitumen and membrane',\n136\t      'Durable: 8 to 10 years of service life',\n137\t    ],\n138\t    transition: 'For a commercial building, this work also strengthens the value of your asset.',\n139\t  },\n140\t  durability: {\n141\t    title: 'The cheapest option ends up costing more on a large building portfolio.',\n142\t    intro: 'Across several thousand square meters, durability matters as much as the price per square meter.',\n143\t    note: 'Covalba compares technologies, not brands: polyurethane and finishing varnish hold their reflectivity better over time.',\n144\t    covalbaLabel: 'Performance designed for occupied buildings',\n145\t  },\n146\t  value: {\n147\t    eyebrow: 'Asset value',\n148\t    title: \"A cool roof coating: a tangible lever for your property's value.\",\n149\t    intro:\n150\t      'Pressure on energy costs is pushing owners to cut building consumption. A cool roof coating acts on the air conditioning line item, without heavy works.',\n151\t    milestones: [\n152\t      { value: '-20%', label: 'cooling bill' },\n153\t      { value: '8-10 years', label: 'of service life' },\n154\t      { value: '+Value', label: 'asset value' },\n155\t    ],\n156\t    points: [\n157\t      'Immediate reduction in air conditioning needs',\n158\t      'Passive and durable action',\n159\t      'Enhanced asset value and protected waterproofing',\n160\t      'CSR commitment that benefits the employer brand',\n161\t    ],\n162\t    note: 'Covalba helps you quantify the expected savings on your building.',\n163\t    cta: 'Estimate my savings',\n164\t  },\n165\t  benefits: {\n166\t    eyebrow: 'Measurable benefits',\n167\t    title: 'Cool teams, controlled costs, a more valuable building.',\n168\t    desc: 'A cool roof coating acts at once on workplace comfort, the cooling bill and energy performance.',\n169\t    metric: '-8 to -10°C',\n170\t    metricLabel: 'under your roof',\n171\t    image: tertiaireOpenSpaceImage,\n172\t    imageAlt: 'Occupied offices during a summer heat peak',\n173\t    transition: 'Each type of commercial building has its own specifics.',\n174\t    cards: [\n175\t      { icon: UsersRound, title: 'More comfortable employees', desc: 'A cooler, more comfortable environment supports focus and well-being.' },\n176\t      { icon: Snowflake, title: 'Less strain on air conditioning', desc: 'Less transmitted heat, up to -20% on the cooling bill.' },\n177\t      { icon: Landmark, title: 'Strengthened asset value', desc: \"A passive action that improves the building's energy performance.\" },\n178\t      { icon: Shield, title: 'Protected roof', desc: 'The coating protects the waterproofing from UV and heat.' },\n179\t      { icon: Sparkles, title: 'CSR and employer brand', desc: 'A visible action for quality of life at work.' },\n180\t    ] as Benefit[],\n181\t  },\n182\t  applications: {\n183\t    eyebrow: 'Your buildings',\n184\t    title: 'A solution for every commercial building.',\n185\t    intro: 'Headquarters, office floors, open-plan spaces and showrooms do not experience heat the same way.',\n186\t    transition: 'That leaves one question: how the work unfolds on a site that stays occupied.',\n187\t    cards: [\n188\t      { icon: Building2, label: 'HQ', title: 'Headquarters', desc: 'Large roofs above continuously occupied floors.', image: tertiaireImage },\n189\t      { icon: BriefcaseBusiness, label: 'Offices', title: 'Office buildings', desc: 'Top floors overheating under the roof.', image: tertiaireImage },\n190\t      { icon: MonitorUp, label: 'Open-plan', title: 'Open-plan spaces', desc: 'High occupant density and sensitivity to thermal comfort.', image: tertiaireOpenSpaceImage },\n191\t      { icon: Handshake, label: 'Showrooms', title: 'Reception spaces', desc: 'Comfort for teams, visitors and clients.', image: tertiaireShowroomImage },\n192\t      { icon: ChartNoAxesCombined, label: 'Portfolios', title: 'Mixed-use buildings', desc: 'Treatment at the scale of a commercial site.', image: tertiaireImage },\n193\t    ] as Application[],\n194\t  },\n195\t  method: {\n196\t    eyebrow: 'The process',\n197\t    title: '4 steps.',\n198\t    mutedTitle: 'Offices stay occupied.',\n199\t    intro:\n200\t      'Your teams keep working. The work is carried out from the outside by your professional contractor and is organized around the occupancy of the floors.',\n201\t    duration: 'Average duration: 2 to 5 days · No interruption of activity',\n202\t    steps: [\n203\t      { title: 'Diagnosis', text: 'Analysis of the roof, the condition of the substrate and the thermal objectives.' },\n204\t      { title: 'Preparation', text: 'Cleaning the substrate and securing the area.' },\n205\t      { title: 'Secure application', text: 'Spray application from the outside, without disrupting office occupancy.' },\n206\t      { title: 'Inspection and follow-up', text: 'Site handover and long-term support.' },\n207\t    ],\n208\t  },\n209\t  proof: {\n210\t    eyebrow: 'Tangible results',\n211\t    title: 'Measured results',\n212\t    mutedTitle: 'on real projects.',\n213\t    intro: 'Offices and showrooms have already put the Covalba coating to the test.',\n214\t    figures: [\n215\t      { icon: TrendingDown, value: '-7.5°C', label: 'on surface temperature' },\n216\t      { icon: Thermometer, value: '3 to 6°C', label: 'of indoor cooling' },\n217\t      { icon: Snowflake, value: '-20%', label: 'on the cooling bill' },\n218\t    ] as Figure[],\n219\t    transition: 'Before launching your project, here are the most frequent questions.',\n220\t  },\n221\t  faq: {\n222\t    intro: 'The points that come up most often among real estate and general services managers.',\n223\t    items: [\n224\t      {\n225\t        q: 'Will the work disrupt activity in my offices?',\n226\t        a: 'No. Everything is done from the outside. Your teams keep working, and the operation is organized so as not to disturb floor occupancy.',\n227\t      },\n228\t      {\n229\t        q: 'What is the gain for employee comfort?',\n230\t        a: 'By lowering the temperature under the roof, a cool roof coating makes the floors, especially the top floors, far more bearable in summer.',\n231\t      },\n232\t      {\n233\t        q: 'Does a cool roof really reduce my energy costs?',\n234\t        a: \"Yes. By reducing air conditioning needs, it lowers the building's consumption and delivers lasting savings on operating costs.\",\n235\t      },\n236\t      {\n237\t        q: 'Does the coating also protect my roof?',\n238\t        a: \"Yes. The coating protects the waterproofing from UV and heat, which extends the roof's service life.\",\n239\t      },\n240\t      {\n241\t        q: 'Is it useful if my offices are not air-conditioned?',\n242\t        a: 'Yes. Without air conditioning, the benefit is measured in comfort: the roof transmits less heat during heat waves.',\n243\t      },\n244\t      {\n245\t        q: 'Which types of roofs are compatible?',\n246\t        a: 'Steel deck, bitumen, membranes and concrete, including older roofs after a technical assessment.',\n247\t      },\n248\t      {\n249\t        q: 'And in winter, will I lose on heating?',\n250\t        a: 'The winter effect is limited: the sun is low and mainly heats the facades. The summer gain largely makes up for it.',\n251\t      },\n252\t      {\n253\t        q: 'How long does the effectiveness last?',\n254\t        a: 'Covalba coatings retain their reflectivity for 8 to 10 years, well beyond low-end products.',\n255\t      },\n256\t    ] as Faq[],\n257\t  },\n258\t  finalCta: {\n259\t    eyebrow: 'Commercial cool roof',\n260\t    title: 'Turn your offices into a cool working environment.',\n261\t    desc: 'Tell us about your building and discover its potential, for your teams, your energy bill and the value of your asset.',\n262\t    reassurances: ['Personalized assessment within 48 hours', 'Strengthened asset value', 'No commitment'],\n263\t  },\n264\t  seo: {\n265\t    eyebrow: 'Commercial sector guide',\n266\t    title: 'Cool roof for offices and commercial buildings: why a reflective roof changes the game.',\n267\t    intro: 'In the commercial sector, summer heat first affects employees and the energy bill.',\n268\t    sections: [\n269\t      { title: 'Why offices overheat', body: 'A dark roof can exceed 80°C at the surface and transmit heat to the top floors, often the hardest to occupy.' },\n270\t      { title: 'The cool roof principle', body: 'A reflective roof combines high solar reflectance and high emissivity to reflect radiation and dissipate heat.' },\n271\t      { title: 'Comfort and working conditions', body: 'Thermal comfort influences well-being, concentration and quality of life at work during hot periods.' },\n272\t      { title: 'Controlling air conditioning', body: 'By limiting heat gain through the roof, a cool roof coating reduces the load on cooling equipment across large surfaces.' },\n273\t      { title: 'Cool roof and energy performance', body: \"By acting on the air conditioning line item, a cool roof coating reduces the building's consumption and strengthens its energy performance over time.\" },\n274\t      { title: 'A coating that lasts', body: 'Covalba polyurethane and finishing varnish systems are designed to last 8 to 10 years while maintaining their performance.' },\n275\t    ] as SeoSection[],\n276\t    sources: [\n277\t      'Lawrence Berkeley National Laboratory, Heat Island Group.',\n278\t      'U.S. Environmental Protection Agency, Cool Roofs.',\n279\t      'Akbari H. et al., roof albedos and thermal comfort.',\n280\t      'Santamouris M., passive cooling.',\n281\t    ],\n282\t  },\n283\t};\n284\t\n285\tconst inputClass =\n286\t  'w-full rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white placeholder:text-white/40 transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n287\t\n288\tconst selectClass =\n289\t  'w-full appearance-none rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n290\t\n291\tconst lightFieldClass =\n292\t  'w-full rounded-xl border border-foreground/10 bg-white px-4 py-3 font-body text-sm text-foreground outline-none transition-all focus:border-teal-vivid/40 focus:ring-2 focus:ring-teal-vivid/15';\n293\t\n294\tconst Seo = () => {\n295\t  usePageMeta({ title: content.meta.title, description: content.meta.description, canonical: CANONICAL });\n296\t  useJsonLd(`${SLUG}-breadcrumb-schema`, {\n297\t    '@context': 'https://schema.org',\n298\t    '@type': 'BreadcrumbList',\n299\t    itemListElement: [\n300\t      { '@type': 'ListItem', position: 1, name: 'Home', item: `${SITE_URL}/en` },\n301\t      { '@type': 'ListItem', position: 2, name: 'Industries', item: `${SITE_URL}/en` },\n302\t      { '@type': 'ListItem', position: 3, name: content.meta.serviceName, item: CANONICAL },\n303\t    ],\n304\t  });\n305\t  useJsonLd(`${SLUG}-service-schema`, {\n306\t    '@context': 'https://schema.org',\n307\t    '@type': 'Service',\n308\t    name: content.meta.serviceName,\n309\t    serviceType: 'Reflective roof coating',\n310\t    provider: { '@type': 'Organization', name: 'Covalba', url: SITE_URL },\n311\t    areaServed: { '@type': 'Country', name: 'France' },\n312\t    description: content.meta.serviceDescription,\n313\t    audience: { '@type': 'BusinessAudience', audienceType: content.meta.audience },\n314\t  });\n315\t  return null;\n316\t};\n317\t\n318\tconst SectorHero = () => {\n319\t  const [form, setForm] = useState({ type: '', climate: '', surface: '', year: '', email: '' });\n320\t  const [submitted, setSubmitted] = useState(false);\n321\t  const surfaceNum = parseFloat(form.surface) || 0;\n322\t  const estimMin = surfaceNum * 18;\n323\t  const estimMax = surfaceNum * 25;\n324\t  const fmt = (n: number) => new Intl.NumberFormat('en-US').format(n);\n325\t\n326\t  return (\n327\t    <section\n328\t      aria-labelledby={`${SLUG}-hero-title`}\n329\t      className=\"relative isolate flex min-h-[100svh] flex-col overflow-hidden bg-navy text-cream\"\n330\t    >\n331\t      <img\n332\t        src={content.hero.image}\n333\t        alt={content.hero.imageAlt}\n334\t        className=\"absolute inset-0 -z-10 size-full scale-[1.02] object-cover\"\n335\t        loading=\"eager\"\n336\t        decoding=\"async\"\n337\t      />\n338\t      <div\n339\t        aria-hidden=\"true\"\n340\t        className=\"absolute inset-0 -z-10 hidden bg-gradient-to-r from-navy/[0.92] via-navy/55 to-navy/25 lg:block\"\n341\t      />\n342\t      <div\n343\t        aria-hidden=\"true\"\n344\t        className=\"absolute inset-0 -z-10 bg-gradient-to-b from-navy/80 via-navy/22 to-navy/95 lg:hidden\"\n345\t      />\n346\t      <div\n347\t        aria-hidden=\"true\"\n348\t        className=\"absolute inset-x-0 bottom-0 -z-10 h-[28%] bg-gradient-to-t from-navy via-navy/85 to-transparent\"\n349\t      />\n350\t\n351\t      <div className=\"container relative z-10 mx-auto flex flex-1 items-center px-6 pb-10 pt-24 lg:px-12 lg:pb-16 lg:pt-28\">\n352\t        <div className=\"grid w-full grid-cols-1 items-center gap-10 lg:grid-cols-[55fr_45fr] lg:gap-12\">\n353\t          <div className=\"max-w-2xl space-y-6 lg:space-y-8\">\n354\t            {content.hero.eyebrow && (\n355\t              <div className=\"flex items-center gap-3\">\n356\t                <span className=\"h-px w-9 bg-teal-vivid\" aria-hidden=\"true\" />\n357\t                <span className=\"font-body text-[11px] font-semibold uppercase tracking-[0.22em] text-teal-vivid\">\n358\t                  {content.hero.eyebrow}\n359\t                </span>\n360\t              </div>\n361\t            )}\n362\t\n363\t            <h1\n364\t              id={`${SLUG}-hero-title`}\n365\t              className=\"font-satoshi font-bold leading-[1.02] text-white\"\n366\t              style={{ fontSize: 'clamp(2.25rem, 4.6vw, 4rem)', letterSpacing: '-0.03em' }}\n367\t            >\n368\t              {content.hero.h1}\n369\t            </h1>\n370\t\n371\t            <p\n372\t              className=\"max-w-xl font-satoshi font-medium leading-[1.3] text-cream/65\"\n373\t              style={{ fontSize: 'clamp(1rem, 1.5vw, 1.375rem)', letterSpacing: '-0.005em' }}\n374\t            >\n375\t              {content.hero.sub}\n376\t            </p>\n377\t\n378\t            <ul className=\"hidden gap-4 pt-1 sm:flex sm:flex-wrap lg:gap-6\" aria-label=\"Key benefits\">\n379\t              {content.hero.stats.map((stat, index) => {\n380\t                const Icon = stat.icon;\n381\t                return (\n382\t                  <li\n383\t                    key={stat.label}\n384\t                    className={`flex items-start gap-3 ${\n385\t                      index !== 0 ? 'sm:border-l sm:border-white/10 sm:pl-6' : ''\n386\t                    }`}\n387\t                  >\n388\t                    <Icon className=\"mt-0.5 h-[18px] w-[18px] shrink-0 text-teal-vivid\" strokeWidth={1.5} />\n389\t                    <div className=\"leading-tight\">\n390\t                      <p className=\"font-satoshi text-[15px] font-bold text-white lg:text-base\">{stat.value}</p>\n391\t                      <p className=\"mt-1 font-body text-[12.5px] text-cream/55 lg:text-[13px]\">{stat.label}</p>\n392\t                    </div>\n393\t                  </li>\n394\t                );\n395\t              })}\n396\t            </ul>\n397\t          </div>\n398\t\n399\t          <div className=\"animate-hero-stats\">\n400\t            <div className=\"rounded-[1.5rem] border border-white/[0.08] bg-white/[0.04] p-1.5 backdrop-blur-sm\">\n401\t              <div className=\"rounded-[calc(1.5rem-6px)] border border-white/[0.06] bg-[#0b1a2b]/80 p-4 shadow-[inset_0_1px_1px_rgba(255,255,255,0.06)] backdrop-blur-xl lg:p-7\">\n402\t                {!submitted ? (\n403\t                  <>\n404\t                    <h2 className=\"mb-1 text-center font-satoshi text-xl font-bold text-white lg:text-2xl\">\n405\t                      {content.hero.formTitle}\n406\t                    </h2>\n407\t                    <p className=\"mb-4 text-center font-body text-[12px] text-white/50\">\n408\t                      {content.hero.formSubtitle}\n409\t                    </p>\n410\t                    <form\n411\t                      onSubmit={(event) => {\n412\t                        event.preventDefault();\n413\t                        setSubmitted(true);\n414\t                      }}\n415\t                      className=\"space-y-2.5 lg:space-y-3\"\n416\t                    >\n417\t                      <select\n418\t                        required\n419\t                        value={form.type}\n420\t                        onChange={(e) => setForm({ ...form, type: e.target.value })}\n421\t                        className={selectClass}\n422\t                      >\n423\t                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n424\t                          {content.hero.formFields.typeLabel}\n425\t                        </option>\n426\t                        {content.hero.formFields.typeOptions.map((option) => (\n427\t                          <option key={option} value={option} className=\"bg-card text-foreground\">\n428\t                            {option}\n429\t                          </option>\n430\t                        ))}\n431\t                      </select>\n432\t                      <select\n433\t                        required\n434\t                        value={form.climate}\n435\t                        onChange={(e) => setForm({ ...form, climate: e.target.value })}\n436\t                        className={selectClass}\n437\t                      >\n438\t                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n439\t                          {content.hero.formFields.climateLabel}\n440\t                        </option>\n441\t                        {content.hero.formFields.climateOptions.map((option) => (\n442\t                          <option key={option} value={option} className=\"bg-card text-foreground\">\n443\t                            {option}\n444\t                          </option>\n445\t                        ))}\n446\t                      </select>\n447\t                      <input\n448\t                        type=\"number\"\n449\t                        placeholder=\"Roof surface (m²)\"\n450\t                        required\n451\t                        min=\"1\"\n452\t                        value={form.surface}\n453\t                        onChange={(e) => setForm({ ...form, surface: e.target.value })}\n454\t                        className={inputClass}\n455\t                      />\n456\t                      <input\n457\t                        type=\"number\"\n458\t                        placeholder={content.hero.formFields.yearLabel}\n459\t                        required\n460\t                        min=\"1900\"\n461\t                        value={form.year}\n462\t                        onChange={(e) => setForm({ ...form, year: e.target.value })}\n463\t                        className={inputClass}\n464\t                      />\n465\t                      <input\n466\t                        type=\"email\"\n467\t                        placeholder=\"Business email\"\n468\t                        required\n469\t                        value={form.email}\n470\t                        onChange={(e) => setForm({ ...form, email: e.target.value })}\n471\t                        className={inputClass}\n472\t                      />\n473\t\n474\t                      <button\n475\t                        type=\"submit\"\n476\t                        className=\"group mt-1 flex w-full items-center justify-center gap-3 rounded-full cta-gradient py-3 font-semibold text-white active:scale-[0.98]\"\n477\t                      >\n478\t                        <span className=\"text-[15px]\">{content.hero.formFields.cta}</span>\n479\t                        <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n480\t                          <ArrowRight className=\"h-4 w-4\" />\n481\t                        </span>\n482\t                      </button>\n483\t                    </form>\n484\t\n485\t                    <p className=\"mt-3 text-center font-body text-[11px] text-white/35\">\n486\t                      {content.hero.formFields.microcopy}\n487\t                    </p>\n488\t                  </>\n489\t                ) : (\n490\t                  <div className=\"py-4 text-center\">\n491\t                    <div className=\"mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-primary/20\">\n492\t                      <Shield className=\"h-6 w-6 text-primary\" />\n493\t                    </div>\n494\t                    <p className=\"mb-1 font-body text-sm text-white/60\">Indicative budget for {fmt(surfaceNum)} m²</p>\n495\t                    <p className=\"mb-4 font-satoshi text-2xl font-bold text-white\">\n496\t                      €{fmt(estimMin)} - €{fmt(estimMax)}\n497\t                    </p>\n498\t                    <p className=\"mb-4 font-body text-[13px] text-white/50\">\n499\t                      An advisor will contact you within 24 hours with a detailed estimate.\n500\t                    </p>\n501\t                    <button\n502\t                      onClick={() => setSubmitted(false)}\n503\t                      className=\"font-body text-sm font-semibold text-primary hover:underline\"\n504\t                    >\n505\t                      Edit my request\n506\t                    </button>\n507\t                  </div>\n508\t                )}\n509\t              </div>\n510\t            </div>\n511\t          </div>\n512\t        </div>\n513\t      </div>\n514\t\n515\t      <div className=\"relative z-10 mt-auto hidden lg:block\">\n516\t        <div className=\"border-t border-white/10 bg-navy/78 py-5 backdrop-blur-md\">\n517\t          <p className=\"mb-3 text-center font-body text-[10px] font-semibold uppercase tracking-[0.2em] text-white/35\">\n518\t            {content.logos.title}\n519\t          </p>\n520\t        </div>\n521\t      </div>\n522\t    </section>\n523\t  );\n524\t};\n525\t\n526\tconst ProblemSection = () => (\n527\t  <section className=\"relative overflow-hidden bg-cream py-20 lg:py-32\">\n528\t    <div className=\"container mx-auto px-4 lg:px-8\">\n529\t      <div className=\"mb-10 grid grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[1.05fr_0.95fr] lg:gap-20\">\n530\t        <div className=\"space-y-6 lg:space-y-9\">\n531\t          <ScrollReveal>\n532\t            <div className=\"flex items-center gap-3\">\n533\t              <span className=\"h-px w-9 bg-terracotta/70\" aria-hidden=\"true\" />\n534\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-terracotta-dark\">\n535\t                {content.problem.eyebrow}\n536\t              </span>\n537\t            </div>\n538\t          </ScrollReveal>\n539\t          <ScrollReveal>\n540\t            <h2\n541\t              className=\"font-satoshi font-bold text-foreground !leading-[1.05]\"\n542\t              style={{ fontSize: 'clamp(1.875rem, 3.6vw, 2.875rem)', letterSpacing: '-0.025em' }}\n543\t            >\n544\t              {content.problem.title}\n545\t              <br />\n546\t              <span className=\"text-foreground/40\">{content.problem.mutedTitle}</span>\n547\t            </h2>\n548\t          </ScrollReveal>\n549\t        </div>\n550\t        <ScrollReveal>\n551\t          <p className=\"max-w-[560px] font-body text-base leading-relaxed text-foreground/65 lg:ml-auto lg:text-[16px]\">\n552\t            {content.problem.intro}\n553\t          </p>\n554\t        </ScrollReveal>\n555\t      </div>\n556\t\n557\t      <ScrollReveal stagger>\n558\t        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 lg:gap-5 xl:gap-6\">\n559\t          {content.problem.cards.map((problem) => {\n560\t            const Icon = problem.icon;\n561\t            return (\n562\t              <article\n563\t                key={problem.title}\n564\t                className=\"group overflow-hidden rounded-2xl bg-white shadow-[0_18px_45px_-34px_hsl(var(--navy)/0.28)] ring-1 ring-foreground/[0.05]\"\n565\t              >\n566\t                <div className=\"relative aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n567\t                  <img src={problem.image} alt={problem.alt} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n568\t                  <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-1/2 bg-gradient-to-t from-navy/45 to-transparent\" />\n569\t                  <span className=\"absolute left-4 top-4 flex h-10 w-10 items-center justify-center rounded-full bg-cream/90 text-terracotta-dark shadow-sm\">\n570\t                    <Icon className=\"h-5 w-5\" strokeWidth={1.7} />\n571\t                  </span>\n572\t                </div>\n573\t                <div className=\"px-6 py-7 lg:px-6 lg:py-8\">\n574\t                  <h3 className=\"mb-3 font-satoshi text-[18px] font-bold !leading-tight text-foreground lg:text-[19px]\">\n575\t                    {problem.title}\n576\t                  </h3>\n577\t                  <p className=\"font-body text-[14px] leading-relaxed text-foreground/62 lg:text-[14.5px]\">\n578\t                    {problem.desc}\n579\t                  </p>\n580\t                </div>\n581\t              </article>\n582\t            );\n583\t          })}\n584\t        </div>\n585\t      </ScrollReveal>\n586\t\n587\t      <ScrollReveal>\n588\t        {content.problem.transition && (\n589\t          <p className=\"mx-auto mt-10 max-w-3xl border-t border-foreground/10 pt-6 text-center font-body text-sm leading-relaxed text-foreground/58 lg:mt-14 lg:text-base\">\n590\t            {content.problem.transition}\n591\t          </p>\n592\t        )}\n593\t      </ScrollReveal>\n594\t    </div>\n595\t  </section>\n596\t);\n597\t\n598\tconst SolutionSection = () => (\n599\t  <section className=\"relative overflow-hidden bg-[#142333] py-20 text-white lg:py-32\">\n600\t    <div\n601\t      aria-hidden=\"true\"\n602\t      className=\"absolute inset-0 opacity-[0.55]\"\n603\t      style={{ backgroundImage: 'linear-gradient(115deg, rgba(255,255,255,0.055) 0 1px, transparent 1px 120px)' }}\n604\t    />\n605\t    <div className=\"container relative mx-auto px-4 lg:px-8\">\n606\t      <ScrollReveal>\n607\t        <div className=\"mx-auto mb-12 grid max-w-6xl grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[0.88fr_1.12fr] lg:gap-16\">\n608\t          <div>\n609\t            <div className=\"mb-6 inline-flex items-center gap-3\">\n610\t              <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n611\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n612\t                {content.solution.eyebrow}\n613\t              </span>\n614\t            </div>\n615\t            <h2\n616\t              className=\"font-satoshi font-bold !leading-[1.04] text-white\"\n617\t              style={{ fontSize: 'clamp(2rem, 3.4vw, 3rem)', letterSpacing: '-0.03em' }}\n618\t            >\n619\t              {content.solution.title}\n620\t              <br />\n621\t              <span className=\"text-white/45\">{content.solution.mutedTitle}</span>\n622\t            </h2>\n623\t          </div>\n624\t          <p className=\"max-w-2xl font-body text-base leading-relaxed text-white/74 lg:text-[17px]\">\n625\t            {content.solution.intro}\n626\t          </p>\n627\t        </div>\n628\t      </ScrollReveal>\n629\t\n630\t      <div className=\"grid grid-cols-1 gap-5 md:grid-cols-2 lg:gap-6\">\n631\t        {[\n632\t          {\n633\t            title: 'Conventional roof',\n634\t            image: classicRoofImage,\n635\t            metric: 'up to 80°C',\n636\t            metricLabel: 'at the surface',\n637\t            points: ['Dark surface', 'Absorbs heat', 'Strains air conditioning'],\n638\t            cool: false,\n639\t          },\n640\t          {\n641\t            title: 'Cool roof',\n642\t            image: coolRoofImage,\n643\t            metric: 'up to 90%',\n644\t            metricLabel: 'of radiation reflected',\n645\t            points: ['Light-colored surface', 'Stays cooler', 'Reduces the thermal load'],\n646\t            cool: true,\n647\t          },\n648\t        ].map((item) => (\n649\t          <article key={item.title} className=\"overflow-hidden rounded-2xl border border-white/10 bg-white/[0.045]\">\n650\t            <div className=\"relative aspect-[1.1] overflow-hidden bg-[#0f1d2a] md:aspect-[1.18]\">\n651\t              <img src={item.image} alt={item.title} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n652\t              <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-2/3 bg-gradient-to-t from-[#142333] via-[#142333]/20 to-transparent\" />\n653\t            </div>\n654\t            <div className=\"p-5 lg:p-7\">\n655\t              <div className=\"mb-6 flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\">\n656\t                <h3 className=\"font-satoshi text-xl font-bold !leading-tight text-white lg:text-2xl\">\n657\t                  {item.title}\n658\t                </h3>\n659\t                <div className={`shrink-0 rounded-xl border px-4 py-3 ${item.cool ? 'border-teal-vivid/18 bg-teal-vivid/10 text-teal-vivid' : 'border-terracotta/18 bg-terracotta/12 text-[#f0a084]'}`}>\n660\t                  <span className=\"block font-satoshi text-2xl font-bold leading-none lg:text-3xl\">{item.metric}</span>\n661\t                  <span className=\"mt-1 block font-body text-[10px] font-bold uppercase tracking-[0.14em] opacity-75\">\n662\t                    {item.metricLabel}\n663\t                  </span>\n664\t                </div>\n665\t              </div>\n666\t              <ul className=\"grid gap-2.5\">\n667\t                {item.points.map((point) => (\n668\t                  <li key={point} className=\"flex items-start gap-2.5\">\n669\t                    <CheckCircle2 className={`mt-0.5 h-4 w-4 shrink-0 ${item.cool ? 'text-teal-vivid' : 'text-[#f0a084]'}`} strokeWidth={2} />\n670\t                    <span className=\"font-body text-sm leading-relaxed text-white/66\">{point}</span>\n671\t                  </li>\n672\t                ))}\n673\t              </ul>\n674\t            </div>\n675\t          </article>\n676\t        ))}\n677\t      </div>\n678\t\n679\t      {(content.solution.points.length > 0 || content.solution.transition) && (\n680\t        <ScrollReveal>\n681\t          <div className=\"mx-auto mt-10 max-w-6xl lg:mt-14\">\n682\t            {content.solution.points.length > 0 && (\n683\t              <ul className=\"grid grid-cols-1 gap-3 md:grid-cols-4\">\n684\t                {content.solution.points.map((point) => (\n685\t                  <li key={point} className=\"flex items-center gap-3 rounded-xl border border-white/10 bg-white/[0.055] px-5 py-4\">\n686\t                    <span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-teal-vivid/12\">\n687\t                      <Check className=\"h-4 w-4 text-teal-vivid\" strokeWidth={1.8} />\n688\t                    </span>\n689\t                    <span className=\"font-body text-sm font-semibold leading-snug text-white/78\">{point}</span>\n690\t                  </li>\n691\t                ))}\n692\t              </ul>\n693\t            )}\n694\t            {content.solution.transition && (\n695\t              <p className=\"mx-auto mt-8 max-w-2xl text-center font-body text-sm leading-relaxed text-white/52\">\n696\t                {content.solution.transition}\n697\t              </p>\n698\t            )}\n699\t          </div>\n700\t        </ScrollReveal>\n701\t      )}\n702\t    </div>\n703\t  </section>\n704\t);\n705\t\n706\tconst DurabilitySection = () => (\n707\t  <section className=\"relative overflow-hidden bg-[#F6FAFB] py-16 lg:py-28\">\n708\t    <div className=\"container mx-auto px-4 lg:px-8\">\n709\t      <ScrollReveal>\n710\t        <div className=\"mx-auto mb-12 max-w-2xl text-center lg:mb-16\">\n711\t          <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n712\t            Durability\n713\t          </p>\n714\t          <h2\n715\t            className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\"\n716\t            style={{ fontSize: 'clamp(2rem, 3.2vw, 2.85rem)', letterSpacing: '-0.03em' }}\n717\t          >\n718\t            {content.durability.title}\n719\t          </h2>\n720\t          <p className=\"font-body text-base leading-relaxed text-foreground/62 lg:text-[17px]\">\n721\t            {content.durability.intro}\n722\t          </p>\n723\t        </div>\n724\t      </ScrollReveal>\n725\t\n726\t      <ScrollReveal>\n727\t        <div className=\"mx-auto grid max-w-5xl grid-cols-1 items-stretch gap-5 lg:grid-cols-2 lg:gap-0\">\n728\t          {[\n729\t            {\n730\t              title: 'Standard acrylic coating',\n731\t              subtitle: 'Low cost to apply',\n732\t              price: '~€10',\n733\t              life: '2-5 years',\n734\t              realCost: '€25-30',\n735\t              covalba: false,\n736\t              points: ['Reflectivity drops quickly', 'Chalking and yellowing', 'More frequent reapplication'],\n737\t            },\n738\t            {\n739\t              title: 'Covalba polyurethane system',\n740\t              subtitle: content.durability.covalbaLabel,\n741\t              price: '€18-20',\n742\t              life: '8-10 years',\n743\t              realCost: '€18-20',\n744\t              covalba: true,\n745\t              points: ['Durable polyurethane resin', 'Anti-UV finishing varnish', 'Reflectivity retained longer'],\n746\t            },\n747\t          ].map((option) => (\n748\t            <article\n749\t              key={option.title}\n750\t              className={`relative rounded-2xl px-7 py-9 shadow-[0_20px_60px_rgba(26,42,58,0.08)] lg:px-10 lg:py-12 ${\n751\t                option.covalba ? 'z-10 bg-foreground text-white lg:-ml-5 lg:scale-[1.03]' : 'bg-white text-foreground lg:scale-[0.97] lg:opacity-90'\n752\t              }`}\n753\t            >\n754\t              {option.covalba && (\n755\t                <span className=\"absolute -top-4 left-1/2 inline-flex -translate-x-1/2 items-center rounded-full bg-teal-vivid px-4 py-2 font-body text-[11px] font-bold uppercase tracking-[0.15em] text-white\">\n756\t                  The durable choice\n757\t                </span>\n758\t              )}\n759\t              <h3 className=\"mb-2 font-satoshi text-2xl font-bold leading-tight lg:text-[1.7rem]\">{option.title}</h3>\n760\t              <p className={`mb-8 font-body text-sm ${option.covalba ? 'text-white/52' : 'text-foreground/50'}`}>\n761\t                {option.subtitle}\n762\t              </p>\n763\t              <div className=\"mb-8 grid grid-cols-3 gap-4\">\n764\t                {[\n765\t                  ['Price per m²', option.price],\n766\t                  ['Service life', option.life],\n767\t                  ['Over 10 years', option.realCost],\n768\t                ].map(([label, value]) => (\n769\t                  <div key={label}>\n770\t                    <p className={`mb-1 font-body text-[10px] uppercase tracking-widest ${option.covalba ? 'text-white/42' : 'text-foreground/38'}`}>\n771\t                      {label}\n772\t                    </p>\n773\t                    <p className={`font-satoshi text-2xl font-bold leading-none lg:text-3xl ${label === 'Over 10 years' ? (option.covalba ? 'text-teal-vivid' : 'text-terracotta') : ''}`}>\n774\t                      {value}\n775\t                    </p>\n776\t                  </div>\n777\t                ))}\n778\t              </div>\n779\t              <ul className=\"space-y-3 border-t border-current/10 pt-7\">\n780\t                {option.points.map((point) => {\n781\t                  const Icon = option.covalba ? Check : X;\n782\t                  return (\n783\t                    <li key={point} className=\"flex items-start gap-2.5\">\n784\t                      <Icon className={`mt-0.5 h-4 w-4 shrink-0 ${option.covalba ? 'text-teal-vivid' : 'text-terracotta/70'}`} />\n785\t                      <span className={`font-body text-sm leading-relaxed ${option.covalba ? 'text-white/70' : 'text-foreground/60'}`}>\n786\t                        {point}\n787\t                      </span>\n788\t                    </li>\n789\t                  );\n790\t                })}\n791\t              </ul>\n792\t            </article>\n793\t          ))}\n794\t        </div>\n795\t      </ScrollReveal>\n796\t\n797\t      <ScrollReveal>\n798\t        <p className=\"mx-auto mt-10 max-w-3xl text-center font-body text-sm leading-relaxed text-foreground/55 lg:text-[15px]\">\n799\t          {content.durability.note}\n800\t        </p>\n801\t      </ScrollReveal>\n802\t    </div>\n803\t  </section>\n804\t);\n805\t\n806\tconst ValueSection = () => {\n807\t  const [submitted, setSubmitted] = useState(false);\n808\t\n809\t  return (\n810\t    <section className=\"relative overflow-hidden bg-white py-16 lg:py-28\">\n811\t      <div className=\"container mx-auto px-4 lg:px-8\">\n812\t        <ScrollReveal>\n813\t          <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 items-end gap-7 lg:mb-14 lg:grid-cols-[0.9fr_1.1fr] lg:gap-16\">\n814\t            <div>\n815\t              <div className=\"mb-5 flex items-center gap-3\">\n816\t                <span className=\"h-px w-10 bg-teal-vivid\" aria-hidden=\"true\" />\n817\t                <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n818\t                  {content.value.eyebrow}\n819\t                </span>\n820\t              </div>\n821\t              <h2\n822\t                className=\"font-satoshi font-bold !leading-[1.04] text-foreground\"\n823\t                style={{ fontSize: 'clamp(1.95rem, 3vw, 2.75rem)', letterSpacing: '-0.03em' }}\n824\t              >\n825\t                {content.value.title}\n826\t              </h2>\n827\t            </div>\n828\t            <p className=\"max-w-2xl font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n829\t              {content.value.intro}\n830\t            </p>\n831\t          </div>\n832\t        </ScrollReveal>\n833\t\n834\t        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-5 lg:grid-cols-[0.82fr_1.18fr] lg:gap-7\">\n835\t          <ScrollReveal>\n836\t            <div className=\"h-full rounded-2xl bg-cream/70 p-6 ring-1 ring-foreground/[0.06] lg:p-7\">\n837\t              {!submitted ? (\n838\t                <>\n839\t                  <h3 className=\"mb-5 font-satoshi text-xl font-bold leading-tight text-foreground\">\n840\t                    Estimate my savings\n841\t                  </h3>\n842\t                  <form\n843\t                    className=\"grid gap-3\"\n844\t                    onSubmit={(event) => {\n845\t                      event.preventDefault();\n846\t                      setSubmitted(true);\n847\t                    }}\n848\t                  >\n849\t                    <select required className={lightFieldClass} defaultValue=\"\">\n850\t                      <option value=\"\" disabled>\n851\t                        Building type\n852\t                      </option>\n853\t                      {content.hero.formFields.typeOptions.map((option) => (\n854\t                        <option key={option}>{option}</option>\n855\t                      ))}\n856\t                    </select>\n857\t                    <input required min=\"1\" type=\"number\" className={lightFieldClass} placeholder=\"Roof surface (m²)\" />\n858\t                    <input required type=\"email\" className={lightFieldClass} placeholder=\"Business email\" />\n859\t                    <button className=\"group mt-1 inline-flex items-center justify-center gap-2 rounded-full bg-teal-vivid py-2.5 pl-6 pr-2 font-semibold text-white\">\n860\t                      <span className=\"text-sm\">{content.value.cta}</span>\n861\t                      <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n862\t                        <ArrowRight className=\"h-3.5 w-3.5\" />\n863\t                      </span>\n864\t                    </button>\n865\t                  </form>\n866\t                </>\n867\t              ) : (\n868\t                <div className=\"flex min-h-[260px] flex-col items-center justify-center text-center\">\n869\t                  <CheckCircle2 className=\"mb-4 h-12 w-12 text-teal-vivid\" strokeWidth={1.7} />\n870\t                  <h3 className=\"mb-3 font-satoshi text-2xl font-bold text-foreground\">Request received.</h3>\n871\t                  <p className=\"max-w-sm font-body text-sm leading-relaxed text-foreground/62\">\n872\t                    Covalba will get back to you with a personalized response.\n873\t                  </p>\n874\t                </div>\n875\t              )}\n876\t            </div>\n877\t          </ScrollReveal>\n878\t\n879\t          <ScrollReveal>\n880\t            <div className=\"rounded-2xl bg-foreground p-6 text-white lg:p-8\">\n881\t              <div className=\"grid gap-4 sm:grid-cols-3\">\n882\t                {content.value.milestones.map((milestone) => (\n883\t                  <div key={milestone.label} className=\"rounded-xl border border-white/10 bg-white/[0.04] p-5\">\n884\t                    <p className=\"font-satoshi text-4xl font-bold leading-none text-teal-vivid\">{milestone.value}</p>\n885\t                    <p className=\"mt-3 font-body text-sm text-white/62\">{milestone.label}</p>\n886\t                  </div>\n887\t                ))}\n888\t              </div>\n889\t              <div className=\"mt-6 grid gap-3\">\n890\t                {content.value.points.map((point) => (\n891\t                  <div key={point} className=\"flex items-start gap-3\">\n892\t                    <CheckCircle2 className=\"mt-0.5 h-4 w-4 shrink-0 text-teal-vivid\" />\n893\t                    <span className=\"font-body text-sm leading-relaxed text-white/68\">{point}</span>\n894\t                  </div>\n895\t                ))}\n896\t              </div>\n897\t            </div>\n898\t            <p className=\"mt-5 rounded-2xl bg-cream/70 p-5 font-body text-xs leading-relaxed text-foreground/58 lg:text-[13px]\">\n899\t              {content.value.note}\n900\t            </p>\n901\t          </ScrollReveal>\n902\t        </div>\n903\t      </div>\n904\t    </section>\n905\t  );\n906\t};\n907\t\n908\tconst BenefitsSection = () => (\n909\t  <>\n910\t    <section className=\"relative overflow-hidden bg-cream pb-12 pt-16 lg:min-h-[640px] lg:pb-8 lg:pt-20\">\n911\t      <figure className=\"absolute right-0 top-0 hidden h-full min-h-[640px] w-[58vw] overflow-hidden lg:block\">\n912\t        <img src={content.benefits.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n913\t        <div aria-hidden=\"true\" className=\"absolute inset-y-0 left-0 w-[56%] bg-gradient-to-r from-cream via-cream/88 to-transparent\" />\n914\t      </figure>\n915\t      <div className=\"container relative z-10 mx-auto px-4 lg:px-8\">\n916\t        <ScrollReveal>\n917\t          <div className=\"max-w-[760px]\">\n918\t            <div className=\"mb-5 flex items-center gap-3 lg:mb-7\">\n919\t              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n920\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n921\t                {content.benefits.eyebrow}\n922\t              </span>\n923\t            </div>\n924\t            <h2\n925\t              className=\"mb-6 font-satoshi font-bold !leading-[1.04] text-foreground\"\n926\t              style={{ fontSize: 'clamp(2.15rem, 3vw, 3rem)' }}\n927\t            >\n928\t              {content.benefits.title}\n929\t            </h2>\n930\t            <p className=\"max-w-[540px] font-body text-base leading-relaxed text-foreground/72 lg:text-[16px]\">\n931\t              {content.benefits.desc}\n932\t            </p>\n933\t            <div className=\"relative z-10 mt-7 max-w-[540px] rounded-2xl bg-white/96 p-6 shadow-[0_22px_70px_-45px_hsl(var(--navy)/0.35)] ring-1 ring-foreground/[0.05]\">\n934\t              <div className=\"grid grid-cols-[48px_minmax(0,1fr)] items-center gap-5\">\n935\t                <Thermometer className=\"h-12 w-12 text-primary\" strokeWidth={1.55} />\n936\t                <div>\n937\t                  <p className=\"mb-3 font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n938\t                    From the very first summer\n939\t                  </p>\n940\t                  <p className=\"font-satoshi text-[3.1rem] font-bold leading-[0.88] text-primary\">{content.benefits.metric}</p>\n941\t                  <p className=\"mt-2 font-satoshi text-xl font-bold leading-tight text-foreground\">{content.benefits.metricLabel}</p>\n942\t                </div>\n943\t              </div>\n944\t            </div>\n945\t          </div>\n946\t        </ScrollReveal>\n947\t      </div>\n948\t    </section>\n949\t\n950\t    <section className=\"relative overflow-hidden bg-white py-14\">\n951\t      <div className=\"container relative mx-auto px-4 lg:px-8\">\n952\t        <ScrollReveal stagger>\n953\t          <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5 lg:gap-4\">\n954\t            {content.benefits.cards.map((benefit, index) => {\n955\t              const Icon = benefit.icon;\n956\t              return (\n957\t                <article key={benefit.title} className=\"min-h-[184px] rounded-2xl bg-cream/65 p-5 ring-1 ring-foreground/[0.05] lg:p-6\">\n958\t                  <div className=\"mb-7 flex h-11 w-11 items-center justify-center rounded-xl bg-white text-primary\">\n959\t                    <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n960\t                  </div>\n961\t                  <span className=\"mb-3 block font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary/70\">\n962\t                    0{index + 1}\n963\t                  </span>\n964\t                  <h3 className=\"font-satoshi text-lg font-bold leading-tight text-foreground lg:text-[19px]\">{benefit.title}</h3>\n965\t                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/62\">{benefit.desc}</p>\n966\t                </article>\n967\t              );\n968\t            })}\n969\t          </div>\n970\t        </ScrollReveal>\n971\t        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n972\t          {content.benefits.transition}\n973\t        </p>\n974\t      </div>\n975\t    </section>\n976\t  </>\n977\t);\n978\t\n979\tconst ApplicationsSection = () => (\n980\t  <section className=\"relative overflow-hidden bg-cream py-16 lg:py-24\">\n981\t    <div className=\"container relative mx-auto px-4 lg:px-8\">\n982\t      <ScrollReveal>\n983\t        <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 gap-6 lg:mb-12 lg:grid-cols-[0.9fr_1.1fr] lg:items-end lg:gap-16\">\n984\t          <div>\n985\t            <div className=\"mb-5 flex items-center gap-3\">\n986\t              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n987\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n988\t                {content.applications.eyebrow}\n989\t              </span>\n990\t            </div>\n991\t            <h2\n992\t              className=\"font-satoshi font-bold !leading-[1.05] text-foreground\"\n993\t              style={{ fontSize: 'clamp(2rem, 3vw, 3rem)' }}\n994\t            >\n995\t              {content.applications.title}\n996\t            </h2>\n997\t          </div>\n998\t          <p className=\"max-w-[540px] border-l border-primary/30 pl-6 font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n999\t            {content.applications.intro}\n1000\t          </p>\n1001\t        </div>\n1002\t      </ScrollReveal>\n1003\t      <ScrollReveal stagger>\n1004\t        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-4 lg:grid-cols-5 lg:gap-5\">\n1005\t          {content.applications.cards.map((card, index) => {\n1006\t            const Icon = card.icon;\n1007\t            return (\n1008\t              <article key={card.title} className=\"overflow-hidden rounded-2xl bg-white shadow-[0_16px_46px_-38px_hsl(var(--navy)/0.34)] ring-1 ring-foreground/[0.06]\">\n1009\t                <div className=\"aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n1010\t                  <img src={card.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n1011\t                </div>\n1012\t                <div className=\"p-5\">\n1013\t                  <div className=\"mb-4 flex items-center justify-between gap-3\">\n1014\t                    <span className=\"inline-flex items-center gap-2 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary\">\n1015\t                      <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n1016\t                      {card.label}\n1017\t                    </span>\n1018\t                    <span className=\"font-body text-xs font-bold text-foreground/22\">0{index + 1}</span>\n1019\t                  </div>\n1020\t                  <h3 className=\"font-satoshi text-xl font-bold leading-tight text-foreground\">{card.title}</h3>\n1021\t                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/60\">{card.desc}</p>\n1022\t                </div>\n1023\t              </article>\n1024\t            );\n1025\t          })}\n1026\t        </div>\n1027\t      </ScrollReveal>\n1028\t      {content.applications.transition && (\n1029\t        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n1030\t          {content.applications.transition}\n1031\t        </p>\n1032\t      )}\n1033\t    </div>\n1034\t  </section>\n1035\t);\n1036\t\n1037\tconst MethodSection = () => {\n1038\t  const [videoOpen, setVideoOpen] = useState(false);\n1039\t  const icons = [ClipboardCheck, CalendarClock, Shield, TrendingDown];\n1040\t  return (\n1041\t    <section className=\"bg-white py-16 lg:py-32\">\n1042\t      <div className=\"container mx-auto px-4 lg:px-8\">\n1043\t        <div className=\"flex flex-col items-start gap-12 lg:flex-row lg:gap-20\">\n1044\t          <div className=\"lg:sticky lg:top-[120px] lg:w-[40%]\">\n1045\t            <ScrollReveal>\n1046\t              <p className=\"mb-6 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/50\">\n1047\t                {content.method.eyebrow}\n1048\t              </p>\n1049\t              <h2\n1050\t                className=\"mb-6 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] sm:text-4xl lg:text-[3rem]\"\n1051\t                style={{ letterSpacing: '-0.03em' }}\n1052\t              >\n1053\t                {content.method.title}\n1054\t                <span className=\"text-foreground/30\"> {content.method.mutedTitle}</span>\n1055\t              </h2>\n1056\t              <p className=\"mb-8 font-body text-base leading-relaxed text-muted-foreground lg:text-lg\">\n1057\t                {content.method.intro}\n1058\t              </p>\n1059\t              <button onClick={() => setVideoOpen(true)} className=\"group flex items-center gap-3 text-primary\">\n1060\t                <div className=\"flex h-12 w-12 items-center justify-center rounded-full bg-primary/10\">\n1061\t                  <Play className=\"h-5 w-5\" />\n1062\t                </div>\n1063\t                <span className=\"font-body text-sm font-semibold\">Watch a project in 2 minutes</span>\n1064\t              </button>\n1065\t            </ScrollReveal>\n1066\t          </div>\n1067\t          <div className=\"relative lg:w-[60%]\">\n1068\t            <div className=\"absolute bottom-4 left-5 top-4 w-px bg-gradient-to-b from-primary/25 via-primary/10 to-transparent lg:left-6\" />\n1069\t            {content.method.steps.map((step, index) => {\n1070\t              const Icon = icons[index] ?? ClipboardCheck;\n1071\t              return (\n1072\t                <ScrollReveal key={step.title}>\n1073\t                  <div className=\"group relative flex items-start gap-5 py-8 lg:gap-7 lg:py-10\">\n1074\t                    <div className=\"relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full border border-primary/20 bg-primary/10 lg:h-12 lg:w-12\">\n1075\t                      <Icon className=\"h-4 w-4 text-primary lg:h-5 lg:w-5\" />\n1076\t                    </div>\n1077\t                    <div className=\"pt-1\">\n1078\t                      <span className=\"mb-2 block font-body text-xs font-bold uppercase tracking-widest text-primary/50\">\n1079\t                        Step 0{index + 1}\n1080\t                      </span>\n1081\t                      <h3 className=\"mb-2 text-xl text-foreground lg:text-2xl\">{step.title}</h3>\n1082\t                      <p className=\"max-w-md font-body text-sm leading-relaxed text-muted-foreground lg:text-base\">{step.text}</p>\n1083\t                    </div>\n1084\t                  </div>\n1085\t                  {index < content.method.steps.length - 1 && <div className=\"ml-5 h-px bg-border lg:ml-6\" />}\n1086\t                </ScrollReveal>\n1087\t              );\n1088\t            })}\n1089\t            <p className=\"ml-16 mt-4 font-body text-xs font-medium text-muted-foreground/50 lg:ml-20\">\n1090\t              {content.method.duration}\n1091\t            </p>\n1092\t          </div>\n1093\t        </div>\n1094\t      </div>\n1095\t      <Dialog open={videoOpen} onOpenChange={setVideoOpen}>\n1096\t        <DialogContent className=\"max-w-4xl overflow-hidden border-none bg-black p-0\">\n1097\t          <div className=\"aspect-video\">\n1098\t            <iframe\n1099\t              src=\"https://www.youtube.com/embed/9HOB5OVH0Ac?autoplay=1\"\n1100\t              className=\"h-full w-full\"\n1101\t              allow=\"autoplay; encrypted-media\"\n1102\t              allowFullScreen\n1103\t              title=\"Covalba Cool Roof, a project in 2 minutes\"\n1104\t            />\n1105\t          </div>\n1106\t        </DialogContent>\n1107\t      </Dialog>\n1108\t    </section>\n1109\t  );\n1110\t};\n1111\t\n1112\tconst ProofSection = () => (\n1113\t  <section className=\"relative overflow-hidden bg-[#192A3A] py-24 lg:py-36\">\n1114\t    <div className=\"container relative mx-auto px-4 lg:px-8\">\n1115\t      <ScrollReveal>\n1116\t        <div className=\"mb-9 flex items-center gap-3 lg:mb-12\">\n1117\t          <span className=\"h-px w-12 bg-teal-vivid/70\" aria-hidden=\"true\" />\n1118\t          <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n1119\t            {content.proof.eyebrow}\n1120\t          </span>\n1121\t        </div>\n1122\t        <div className=\"mb-14 grid grid-cols-1 items-start gap-8 lg:mb-20 lg:grid-cols-[3fr_2fr] lg:gap-16\">\n1123\t          <h2\n1124\t            className=\"font-satoshi font-bold text-white !leading-[1.05]\"\n1125\t            style={{ fontSize: 'clamp(1.875rem, 3.8vw, 3rem)', letterSpacing: '-0.03em' }}\n1126\t          >\n1127\t            {content.proof.title}\n1128\t            <br />\n1129\t            <span className=\"text-teal-vivid\">{content.proof.mutedTitle}</span>\n1130\t          </h2>\n1131\t          <p className=\"max-w-[470px] font-body text-base leading-relaxed text-white/65 lg:mt-2 lg:text-[16px]\">\n1132\t            {content.proof.intro}\n1133\t          </p>\n1134\t        </div>\n1135\t      </ScrollReveal>\n1136\t      <ScrollReveal stagger>\n1137\t        <div className=\"grid grid-cols-1 gap-4 md:grid-cols-3 lg:gap-5\">\n1138\t          {content.proof.figures.map((figure) => {\n1139\t            const Icon = figure.icon;\n1140\t            return (\n1141\t              <div key={figure.label} className=\"rounded-2xl border border-white/10 bg-white/[0.04] p-8 lg:p-9\">\n1142\t                <div className=\"mb-6 flex h-11 w-11 items-center justify-center rounded-full bg-teal-vivid/[0.12]\">\n1143\t                  <Icon className=\"h-5 w-5 text-teal-vivid\" strokeWidth={1.6} />\n1144\t                </div>\n1145\t                <p className=\"mb-3 font-satoshi text-4xl font-bold leading-none text-white\">{figure.value}</p>\n1146\t                <p className=\"font-body text-sm leading-relaxed text-white/60\">{figure.label}</p>\n1147\t              </div>\n1148\t            );\n1149\t          })}\n1150\t        </div>\n1151\t      </ScrollReveal>\n1152\t      <div className=\"mt-12 border-t border-white/10 pt-10\">\n1153\t        <p className=\"mx-auto max-w-2xl text-center font-body text-sm leading-relaxed text-white/70\">\n1154\t          {content.proof.transition}\n1155\t        </p>\n1156\t      </div>\n1157\t    </div>\n1158\t  </section>\n1159\t);\n1160\t\n1161\tconst FaqSection = () => (\n1162\t  <section className=\"bg-cream py-20 lg:py-32\">\n1163\t    <div className=\"container mx-auto px-4 lg:px-8\">\n1164\t      <ScrollReveal>\n1165\t        <div className=\"grid items-start gap-10 lg:grid-cols-[0.85fr_1.15fr] lg:gap-16\">\n1166\t          <div className=\"lg:sticky lg:top-24\">\n1167\t            <div className=\"mb-5 flex items-center gap-3\">\n1168\t              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n1169\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">FAQ</span>\n1170\t            </div>\n1171\t            <h2 className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\" style={{ fontSize: 'clamp(2rem, 3.3vw, 3rem)', letterSpacing: '-0.03em' }}>\n1172\t              Your questions,\n1173\t              <br />\n1174\t              <span className=\"text-foreground/40\">our answers.</span>\n1175\t            </h2>\n1176\t            <p className=\"max-w-[420px] font-body text-base leading-relaxed text-foreground/65 lg:text-[15.5px]\">\n1177\t              {content.faq.intro}\n1178\t            </p>\n1179\t            <a href={`#contact-${SLUG}`} className=\"group mt-8 inline-flex items-center gap-2 text-sm font-semibold text-primary\">\n1180\t              Another question? Let's talk\n1181\t              <ArrowRight className=\"h-4 w-4\" />\n1182\t            </a>\n1183\t          </div>\n1184\t          <Accordion type=\"single\" collapsible className=\"space-y-3\">\n1185\t            {content.faq.items.map((faq, index) => (\n1186\t              <AccordionItem key={faq.q} value={`${SLUG}-faq-${index}`} className=\"rounded-xl border border-foreground/[0.06] bg-white px-5 shadow-[0_12px_34px_rgba(24,42,58,0.04)] lg:px-6\">\n1187\t                <AccordionTrigger className=\"py-5 text-left font-satoshi text-base font-bold text-foreground hover:no-underline lg:text-[17px]\">\n1188\t                  {faq.q}\n1189\t                </AccordionTrigger>\n1190\t                <AccordionContent className=\"pb-5 font-body text-[14.5px] leading-relaxed text-foreground/67 lg:text-[15px]\">\n1191\t                  {faq.a}\n1192\t                </AccordionContent>\n1193\t              </AccordionItem>\n1194\t            ))}\n1195\t          </Accordion>\n1196\t        </div>\n1197\t      </ScrollReveal>\n1198\t    </div>\n1199\t  </section>\n1200\t);\n1201\t\n1202\tconst FinalCta = () => (\n1203\t  <section id={`contact-${SLUG}`} className=\"overflow-hidden bg-[#182A3A] py-20 lg:py-32\">\n1204\t    <div className=\"container mx-auto px-4 lg:px-8\">\n1205\t      <ScrollReveal>\n1206\t        <div className=\"mx-auto max-w-4xl text-center\">\n1207\t          <div className=\"mb-6 inline-flex items-center gap-3\">\n1208\t            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n1209\t            <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n1210\t              {content.finalCta.eyebrow}\n1211\t            </span>\n1212\t            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n1213\t          </div>\n1214\t          <h2 className=\"mb-6 font-satoshi font-bold text-white !leading-[1.04]\" style={{ fontSize: 'clamp(2rem, 3.8vw, 3.5rem)', letterSpacing: '-0.03em' }}>\n1215\t            {content.finalCta.title}\n1216\t          </h2>\n1217\t          <p className=\"mx-auto mb-9 max-w-2xl font-body text-base leading-relaxed text-white/[0.72] lg:text-[17px]\">\n1218\t            {content.finalCta.desc}\n1219\t          </p>\n1220\t          <div className=\"flex flex-col items-stretch justify-center gap-3 sm:flex-row sm:items-center\">\n1221\t            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full cta-gradient py-2.5 pl-6 pr-2 font-semibold text-white\">\n1222\t              <span className=\"text-sm\">Request a quote</span>\n1223\t              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20\">\n1224\t                <ArrowRight className=\"h-3.5 w-3.5\" />\n1225\t              </span>\n1226\t            </a>\n1227\t            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full border border-white/[0.22] py-2.5 pl-6 pr-2 font-semibold text-white/[0.88]\">\n1228\t              <span className=\"text-sm\">Talk to an expert</span>\n1229\t              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/[0.12]\">\n1230\t                <ArrowRight className=\"h-3.5 w-3.5\" />\n1231\t              </span>\n1232\t            </a>\n1233\t          </div>\n1234\t        </div>\n1235\t      </ScrollReveal>\n1236\t      <ul className=\"mx-auto mt-12 grid max-w-3xl gap-3 sm:grid-cols-3\">\n1237\t        {content.finalCta.reassurances.map((item, index) => {\n1238\t          const icons = [CalendarCheck, BadgeCheck, Shield];\n1239\t          const Icon = icons[index] ?? BadgeCheck;\n1240\t          return (\n1241\t            <li key={item} className=\"flex items-center justify-center gap-2.5 rounded-lg border border-white/[0.12] bg-white/[0.045] px-4 py-3\">\n1242\t              <Icon className=\"h-4 w-4 shrink-0 text-teal-vivid\" strokeWidth={1.8} />\n1243\t              <span className=\"font-body text-sm text-white/[0.76]\">{item}</span>\n1244\t            </li>\n1245\t          );\n1246\t        })}\n1247\t      </ul>\n1248\t    </div>\n1249\t  </section>\n1250\t);\n1251\t\n1252\tconst SeoContent = () => (\n1253\t  <section className=\"bg-cream py-16 lg:py-28\">\n1254\t    <div className=\"container mx-auto px-4 lg:px-8\">\n1255\t      <div className=\"mx-auto max-w-5xl\">\n1256\t        <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n1257\t          {content.seo.eyebrow}\n1258\t        </p>\n1259\t        <h2 className=\"mb-5 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] lg:text-5xl\">\n1260\t          {content.seo.title}\n1261\t        </h2>\n1262\t        <p className=\"mb-12 max-w-3xl font-body text-base leading-relaxed text-foreground/64\">\n1263\t          {content.seo.intro}\n1264\t        </p>\n1265\t        <div className=\"grid gap-10 md:grid-cols-2\">\n1266\t          {content.seo.sections.map((section) => (\n1267\t            <article key={section.title}>\n1268\t              <h3 className=\"mb-3 font-satoshi text-xl font-bold text-foreground\">{section.title}</h3>\n1269\t              <p className=\"font-body text-sm leading-relaxed text-foreground/68\">{section.body}</p>\n1270\t            </article>\n1271\t          ))}\n1272\t        </div>\n1273\t        <div className=\"mt-12 border-t border-foreground/10 pt-8\">\n1274\t          <p className=\"mb-4 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-foreground/38\">Sources</p>\n1275\t          <ul className=\"grid gap-2 font-body text-xs leading-relaxed text-foreground/50 md:grid-cols-2\">\n1276\t            {content.seo.sources.map((source) => (\n1277\t              <li key={source}>{source}</li>\n1278\t            ))}\n1279\t          </ul>\n1280\t        </div>\n1281\t      </div>\n1282\t    </div>\n1283\t  </section>\n1284\t);\n1285\t\n1286\tconst CommercialEN = () => (\n1287\t  <>\n1288\t    <NavbarEN />\n1289\t    <main>\n1290\t      <Seo />\n1291\t      <SectorHero />\n1292\t      <ProblemSection />\n1293\t      <SolutionSection />\n1294\t      <DurabilitySection />\n1295\t      <ValueSection />\n1296\t      <BenefitsSection />\n1297\t      <ApplicationsSection />\n1298\t      <MethodSection />\n1299\t      <ProofSection />\n1300\t      <FaqSection />\n1301\t      <FinalCta />\n1302\t      <SeoContent />\n1303\t    </main>\n1304\t    <FooterEN />\n1305\t    <StickyMobileCTAEN />\n1306\t  </>\n1307\t);\n1308\t\n1309\texport default CommercialEN;\n1310\t"}]},"uuid":"e1a6bdfb-7855-42c8-a46d-9b8a12907069","timestamp":"2026-06-21T23:05:08.770Z","toolUseResult":{"type":"text","file":{"filePath":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/en/CommercialEN.tsx","content":"import { useState } from 'react';\nimport {\n  ArrowRight,\n  BadgeCheck,\n  BriefcaseBusiness,\n  Building2,\n  CalendarCheck,\n  CalendarClock,\n  ChartNoAxesCombined,\n  Check,\n  CheckCircle2,\n  ClipboardCheck,\n  Flame,\n  Handshake,\n  Landmark,\n  MonitorUp,\n  Play,\n  Shield,\n  Snowflake,\n  Sparkles,\n  Thermometer,\n  TrendingDown,\n  UsersRound,\n  X,\n  type LucideIcon,\n} from 'lucide-react';\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';\nimport { Dialog, DialogContent } from '@/components/ui/dialog';\nimport ScrollReveal from '@/components/ScrollReveal';\nimport { useJsonLd, usePageMeta } from '@/hooks/usePageMeta';\nimport classicRoofImage from '@/assets/industrie/logistique-solution-classic.webp';\nimport coolRoofImage from '@/assets/industrie/logistique-solution-coolroof.webp';\nimport NavbarEN from '@/components/en/NavbarEN';\nimport FooterEN from '@/components/en/FooterEN';\nimport StickyMobileCTAEN from '@/components/en/StickyMobileCTAEN';\n\nconst SITE_URL = 'https://www.covalba.fr';\nconst SLUG = 'commercial';\nconst CANONICAL = `${SITE_URL}/en/industries/commercial`;\n\nconst tertiaireImage = '/images/tertiaire/hero-bureaux.webp';\nconst tertiaireOpenSpaceImage = '/images/tertiaire/open-space-chaleur.webp';\nconst tertiaireShowroomImage = '/images/tertiaire/showroom-coolroof.webp';\n\ntype Logo = { name: string; url?: string };\ntype HeroStat = { icon: LucideIcon; value: string; label: string };\ntype ProblemCard = { icon: LucideIcon; title: string; desc: string; image: string; alt: string };\ntype Benefit = { icon: LucideIcon; title: string; desc: string };\ntype Application = { icon: LucideIcon; label: string; title: string; desc: string; image: string };\ntype Figure = { icon: LucideIcon; value: string; label: string };\ntype Faq = { q: string; a: string };\ntype SeoSection = { title: string; body: string };\n\nconst content = {\n  meta: {\n    title: 'Cool roof for offices and commercial buildings: -10°C under the roof | Covalba',\n    description:\n      'Reflective roof coating for offices and commercial buildings: up to -10°C under the roof and -20% on cooling. Team comfort and asset value, without major works.',\n    serviceName: 'Cool roof for offices and commercial buildings',\n    serviceDescription:\n      'Reflective roof coating for offices, headquarters, open-plan spaces and existing commercial buildings: employee comfort, less strain on air conditioning and stronger asset value.',\n    audience: 'Real estate directors, facility managers, general services managers and CSR managers',\n  },\n  hero: {\n    eyebrow: 'Commercial cool roof',\n    h1: 'Cool roof for offices and commercial buildings',\n    sub: 'Keep your offices cool all summer: employees stay comfortable, less strain on air conditioning, energy costs under control.',\n    image: tertiaireImage,\n    imageAlt: 'Modern commercial building exposed to the sun',\n    stats: [\n      { icon: Thermometer, value: '-8 to -10°C', label: 'under the roof' },\n      { icon: Snowflake, value: '-20%', label: 'cooling bill' },\n      { icon: BadgeCheck, value: 'Asset value', label: 'tangible benefit' },\n    ] as HeroStat[],\n    formTitle: 'Request a quote',\n    formSubtitle: 'Personalized response within 24 hours',\n    formFields: {\n      typeLabel: 'Building type',\n      typeOptions: ['Headquarters', 'Office building', 'Open-plan space', 'Showroom', 'Other'],\n      climateLabel: 'Air-conditioned building?',\n      climateOptions: ['Yes', 'No', 'Partially', 'To be confirmed'],\n      yearLabel: 'Year built',\n      microcopy: 'No commitment · Assessment tailored to offices',\n      cta: 'Request a quote',\n    },\n  },\n  logos: {\n    title: 'Office and commercial building owners already trust us',\n  },\n  problem: {\n    eyebrow: 'Why act',\n    title: 'The heat is',\n    mutedTitle: 'wearing down your teams.',\n    intro: 'Top floors overheat, air conditioning runs hard, and working conditions deteriorate during summer peaks.',\n    transition: 'All these problems share a common cause: a roof that absorbs heat instead of reflecting it.',\n    cards: [\n      {\n        icon: UsersRound,\n        title: 'Employees suffering in the heat',\n        desc: 'Above 28-30°C, comfort, concentration and well-being drop.',\n        image: tertiaireImage,\n        alt: 'Office floor exposed to heat',\n      },\n      {\n        icon: Flame,\n        title: 'Unlivable floors under the roof',\n        desc: 'Top floors become hard to occupy during summer peaks.',\n        image: tertiaireOpenSpaceImage,\n        alt: 'Teams in a hot workspace',\n      },\n      {\n        icon: Snowflake,\n        title: 'Air conditioning under pressure',\n        desc: 'Units run at full capacity to hold the setpoint.',\n        image: '/images/distribution/problem-climatisation.webp',\n        alt: 'Air conditioning units on a roof',\n      },\n      {\n        icon: Landmark,\n        title: 'Rising energy costs',\n        desc: 'Across large surfaces, the cooling bill weighs heavily every summer.',\n        image: tertiaireImage,\n        alt: 'Light-colored, durable commercial roof',\n      },\n    ] as ProblemCard[],\n  },\n  solution: {\n    eyebrow: 'The Covalba solution',\n    title: 'Your roof reflects',\n    mutedTitle: 'instead of heating up.',\n    intro: 'A cool roof coating addresses the cause: a light-colored surface reflects radiation before it reaches the offices.',\n    points: [\n      'Passive solution, with no energy consumption',\n      'Applied from the outside, without interrupting activity',\n      'Compatible with steel deck, bitumen and membrane',\n      'Durable: 8 to 10 years of service life',\n    ],\n    transition: 'For a commercial building, this work also strengthens the value of your asset.',\n  },\n  durability: {\n    title: 'The cheapest option ends up costing more on a large building portfolio.',\n    intro: 'Across several thousand square meters, durability matters as much as the price per square meter.',\n    note: 'Covalba compares technologies, not brands: polyurethane and finishing varnish hold their reflectivity better over time.',\n    covalbaLabel: 'Performance designed for occupied buildings',\n  },\n  value: {\n    eyebrow: 'Asset value',\n    title: \"A cool roof coating: a tangible lever for your property's value.\",\n    intro:\n      'Pressure on energy costs is pushing owners to cut building consumption. A cool roof coating acts on the air conditioning line item, without heavy works.',\n    milestones: [\n      { value: '-20%', label: 'cooling bill' },\n      { value: '8-10 years', label: 'of service life' },\n      { value: '+Value', label: 'asset value' },\n    ],\n    points: [\n      'Immediate reduction in air conditioning needs',\n      'Passive and durable action',\n      'Enhanced asset value and protected waterproofing',\n      'CSR commitment that benefits the employer brand',\n    ],\n    note: 'Covalba helps you quantify the expected savings on your building.',\n    cta: 'Estimate my savings',\n  },\n  benefits: {\n    eyebrow: 'Measurable benefits',\n    title: 'Cool teams, controlled costs, a more valuable building.',\n    desc: 'A cool roof coating acts at once on workplace comfort, the cooling bill and energy performance.',\n    metric: '-8 to -10°C',\n    metricLabel: 'under your roof',\n    image: tertiaireOpenSpaceImage,\n    imageAlt: 'Occupied offices during a summer heat peak',\n    transition: 'Each type of commercial building has its own specifics.',\n    cards: [\n      { icon: UsersRound, title: 'More comfortable employees', desc: 'A cooler, more comfortable environment supports focus and well-being.' },\n      { icon: Snowflake, title: 'Less strain on air conditioning', desc: 'Less transmitted heat, up to -20% on the cooling bill.' },\n      { icon: Landmark, title: 'Strengthened asset value', desc: \"A passive action that improves the building's energy performance.\" },\n      { icon: Shield, title: 'Protected roof', desc: 'The coating protects the waterproofing from UV and heat.' },\n      { icon: Sparkles, title: 'CSR and employer brand', desc: 'A visible action for quality of life at work.' },\n    ] as Benefit[],\n  },\n  applications: {\n    eyebrow: 'Your buildings',\n    title: 'A solution for every commercial building.',\n    intro: 'Headquarters, office floors, open-plan spaces and showrooms do not experience heat the same way.',\n    transition: 'That leaves one question: how the work unfolds on a site that stays occupied.',\n    cards: [\n      { icon: Building2, label: 'HQ', title: 'Headquarters', desc: 'Large roofs above continuously occupied floors.', image: tertiaireImage },\n      { icon: BriefcaseBusiness, label: 'Offices', title: 'Office buildings', desc: 'Top floors overheating under the roof.', image: tertiaireImage },\n      { icon: MonitorUp, label: 'Open-plan', title: 'Open-plan spaces', desc: 'High occupant density and sensitivity to thermal comfort.', image: tertiaireOpenSpaceImage },\n      { icon: Handshake, label: 'Showrooms', title: 'Reception spaces', desc: 'Comfort for teams, visitors and clients.', image: tertiaireShowroomImage },\n      { icon: ChartNoAxesCombined, label: 'Portfolios', title: 'Mixed-use buildings', desc: 'Treatment at the scale of a commercial site.', image: tertiaireImage },\n    ] as Application[],\n  },\n  method: {\n    eyebrow: 'The process',\n    title: '4 steps.',\n    mutedTitle: 'Offices stay occupied.',\n    intro:\n      'Your teams keep working. The work is carried out from the outside by your professional contractor and is organized around the occupancy of the floors.',\n    duration: 'Average duration: 2 to 5 days · No interruption of activity',\n    steps: [\n      { title: 'Diagnosis', text: 'Analysis of the roof, the condition of the substrate and the thermal objectives.' },\n      { title: 'Preparation', text: 'Cleaning the substrate and securing the area.' },\n      { title: 'Secure application', text: 'Spray application from the outside, without disrupting office occupancy.' },\n      { title: 'Inspection and follow-up', text: 'Site handover and long-term support.' },\n    ],\n  },\n  proof: {\n    eyebrow: 'Tangible results',\n    title: 'Measured results',\n    mutedTitle: 'on real projects.',\n    intro: 'Offices and showrooms have already put the Covalba coating to the test.',\n    figures: [\n      { icon: TrendingDown, value: '-7.5°C', label: 'on surface temperature' },\n      { icon: Thermometer, value: '3 to 6°C', label: 'of indoor cooling' },\n      { icon: Snowflake, value: '-20%', label: 'on the cooling bill' },\n    ] as Figure[],\n    transition: 'Before launching your project, here are the most frequent questions.',\n  },\n  faq: {\n    intro: 'The points that come up most often among real estate and general services managers.',\n    items: [\n      {\n        q: 'Will the work disrupt activity in my offices?',\n        a: 'No. Everything is done from the outside. Your teams keep working, and the operation is organized so as not to disturb floor occupancy.',\n      },\n      {\n        q: 'What is the gain for employee comfort?',\n        a: 'By lowering the temperature under the roof, a cool roof coating makes the floors, especially the top floors, far more bearable in summer.',\n      },\n      {\n        q: 'Does a cool roof really reduce my energy costs?',\n        a: \"Yes. By reducing air conditioning needs, it lowers the building's consumption and delivers lasting savings on operating costs.\",\n      },\n      {\n        q: 'Does the coating also protect my roof?',\n        a: \"Yes. The coating protects the waterproofing from UV and heat, which extends the roof's service life.\",\n      },\n      {\n        q: 'Is it useful if my offices are not air-conditioned?',\n        a: 'Yes. Without air conditioning, the benefit is measured in comfort: the roof transmits less heat during heat waves.',\n      },\n      {\n        q: 'Which types of roofs are compatible?',\n        a: 'Steel deck, bitumen, membranes and concrete, including older roofs after a technical assessment.',\n      },\n      {\n        q: 'And in winter, will I lose on heating?',\n        a: 'The winter effect is limited: the sun is low and mainly heats the facades. The summer gain largely makes up for it.',\n      },\n      {\n        q: 'How long does the effectiveness last?',\n        a: 'Covalba coatings retain their reflectivity for 8 to 10 years, well beyond low-end products.',\n      },\n    ] as Faq[],\n  },\n  finalCta: {\n    eyebrow: 'Commercial cool roof',\n    title: 'Turn your offices into a cool working environment.',\n    desc: 'Tell us about your building and discover its potential, for your teams, your energy bill and the value of your asset.',\n    reassurances: ['Personalized assessment within 48 hours', 'Strengthened asset value', 'No commitment'],\n  },\n  seo: {\n    eyebrow: 'Commercial sector guide',\n    title: 'Cool roof for offices and commercial buildings: why a reflective roof changes the game.',\n    intro: 'In the commercial sector, summer heat first affects employees and the energy bill.',\n    sections: [\n      { title: 'Why offices overheat', body: 'A dark roof can exceed 80°C at the surface and transmit heat to the top floors, often the hardest to occupy.' },\n      { title: 'The cool roof principle', body: 'A reflective roof combines high solar reflectance and high emissivity to reflect radiation and dissipate heat.' },\n      { title: 'Comfort and working conditions', body: 'Thermal comfort influences well-being, concentration and quality of life at work during hot periods.' },\n      { title: 'Controlling air conditioning', body: 'By limiting heat gain through the roof, a cool roof coating reduces the load on cooling equipment across large surfaces.' },\n      { title: 'Cool roof and energy performance', body: \"By acting on the air conditioning line item, a cool roof coating reduces the building's consumption and strengthens its energy performance over time.\" },\n      { title: 'A coating that lasts', body: 'Covalba polyurethane and finishing varnish systems are designed to last 8 to 10 years while maintaining their performance.' },\n    ] as SeoSection[],\n    sources: [\n      'Lawrence Berkeley National Laboratory, Heat Island Group.',\n      'U.S. Environmental Protection Agency, Cool Roofs.',\n      'Akbari H. et al., roof albedos and thermal comfort.',\n      'Santamouris M., passive cooling.',\n    ],\n  },\n};\n\nconst inputClass =\n  'w-full rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white placeholder:text-white/40 transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n\nconst selectClass =\n  'w-full appearance-none rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n\nconst lightFieldClass =\n  'w-full rounded-xl border border-foreground/10 bg-white px-4 py-3 font-body text-sm text-foreground outline-none transition-all focus:border-teal-vivid/40 focus:ring-2 focus:ring-teal-vivid/15';\n\nconst Seo = () => {\n  usePageMeta({ title: content.meta.title, description: content.meta.description, canonical: CANONICAL });\n  useJsonLd(`${SLUG}-breadcrumb-schema`, {\n    '@context': 'https://schema.org',\n    '@type': 'BreadcrumbList',\n    itemListElement: [\n      { '@type': 'ListItem', position: 1, name: 'Home', item: `${SITE_URL}/en` },\n      { '@type': 'ListItem', position: 2, name: 'Industries', item: `${SITE_URL}/en` },\n      { '@type': 'ListItem', position: 3, name: content.meta.serviceName, item: CANONICAL },\n    ],\n  });\n  useJsonLd(`${SLUG}-service-schema`, {\n    '@context': 'https://schema.org',\n    '@type': 'Service',\n    name: content.meta.serviceName,\n    serviceType: 'Reflective roof coating',\n    provider: { '@type': 'Organization', name: 'Covalba', url: SITE_URL },\n    areaServed: { '@type': 'Country', name: 'France' },\n    description: content.meta.serviceDescription,\n    audience: { '@type': 'BusinessAudience', audienceType: content.meta.audience },\n  });\n  return null;\n};\n\nconst SectorHero = () => {\n  const [form, setForm] = useState({ type: '', climate: '', surface: '', year: '', email: '' });\n  const [submitted, setSubmitted] = useState(false);\n  const surfaceNum = parseFloat(form.surface) || 0;\n  const estimMin = surfaceNum * 18;\n  const estimMax = surfaceNum * 25;\n  const fmt = (n: number) => new Intl.NumberFormat('en-US').format(n);\n\n  return (\n    <section\n      aria-labelledby={`${SLUG}-hero-title`}\n      className=\"relative isolate flex min-h-[100svh] flex-col overflow-hidden bg-navy text-cream\"\n    >\n      <img\n        src={content.hero.image}\n        alt={content.hero.imageAlt}\n        className=\"absolute inset-0 -z-10 size-full scale-[1.02] object-cover\"\n        loading=\"eager\"\n        decoding=\"async\"\n      />\n      <div\n        aria-hidden=\"true\"\n        className=\"absolute inset-0 -z-10 hidden bg-gradient-to-r from-navy/[0.92] via-navy/55 to-navy/25 lg:block\"\n      />\n      <div\n        aria-hidden=\"true\"\n        className=\"absolute inset-0 -z-10 bg-gradient-to-b from-navy/80 via-navy/22 to-navy/95 lg:hidden\"\n      />\n      <div\n        aria-hidden=\"true\"\n        className=\"absolute inset-x-0 bottom-0 -z-10 h-[28%] bg-gradient-to-t from-navy via-navy/85 to-transparent\"\n      />\n\n      <div className=\"container relative z-10 mx-auto flex flex-1 items-center px-6 pb-10 pt-24 lg:px-12 lg:pb-16 lg:pt-28\">\n        <div className=\"grid w-full grid-cols-1 items-center gap-10 lg:grid-cols-[55fr_45fr] lg:gap-12\">\n          <div className=\"max-w-2xl space-y-6 lg:space-y-8\">\n            {content.hero.eyebrow && (\n              <div className=\"flex items-center gap-3\">\n                <span className=\"h-px w-9 bg-teal-vivid\" aria-hidden=\"true\" />\n                <span className=\"font-body text-[11px] font-semibold uppercase tracking-[0.22em] text-teal-vivid\">\n                  {content.hero.eyebrow}\n                </span>\n              </div>\n            )}\n\n            <h1\n              id={`${SLUG}-hero-title`}\n              className=\"font-satoshi font-bold leading-[1.02] text-white\"\n              style={{ fontSize: 'clamp(2.25rem, 4.6vw, 4rem)', letterSpacing: '-0.03em' }}\n            >\n              {content.hero.h1}\n            </h1>\n\n            <p\n              className=\"max-w-xl font-satoshi font-medium leading-[1.3] text-cream/65\"\n              style={{ fontSize: 'clamp(1rem, 1.5vw, 1.375rem)', letterSpacing: '-0.005em' }}\n            >\n              {content.hero.sub}\n            </p>\n\n            <ul className=\"hidden gap-4 pt-1 sm:flex sm:flex-wrap lg:gap-6\" aria-label=\"Key benefits\">\n              {content.hero.stats.map((stat, index) => {\n                const Icon = stat.icon;\n                return (\n                  <li\n                    key={stat.label}\n                    className={`flex items-start gap-3 ${\n                      index !== 0 ? 'sm:border-l sm:border-white/10 sm:pl-6' : ''\n                    }`}\n                  >\n                    <Icon className=\"mt-0.5 h-[18px] w-[18px] shrink-0 text-teal-vivid\" strokeWidth={1.5} />\n                    <div className=\"leading-tight\">\n                      <p className=\"font-satoshi text-[15px] font-bold text-white lg:text-base\">{stat.value}</p>\n                      <p className=\"mt-1 font-body text-[12.5px] text-cream/55 lg:text-[13px]\">{stat.label}</p>\n                    </div>\n                  </li>\n                );\n              })}\n            </ul>\n          </div>\n\n          <div className=\"animate-hero-stats\">\n            <div className=\"rounded-[1.5rem] border border-white/[0.08] bg-white/[0.04] p-1.5 backdrop-blur-sm\">\n              <div className=\"rounded-[calc(1.5rem-6px)] border border-white/[0.06] bg-[#0b1a2b]/80 p-4 shadow-[inset_0_1px_1px_rgba(255,255,255,0.06)] backdrop-blur-xl lg:p-7\">\n                {!submitted ? (\n                  <>\n                    <h2 className=\"mb-1 text-center font-satoshi text-xl font-bold text-white lg:text-2xl\">\n                      {content.hero.formTitle}\n                    </h2>\n                    <p className=\"mb-4 text-center font-body text-[12px] text-white/50\">\n                      {content.hero.formSubtitle}\n                    </p>\n                    <form\n                      onSubmit={(event) => {\n                        event.preventDefault();\n                        setSubmitted(true);\n                      }}\n                      className=\"space-y-2.5 lg:space-y-3\"\n                    >\n                      <select\n                        required\n                        value={form.type}\n                        onChange={(e) => setForm({ ...form, type: e.target.value })}\n                        className={selectClass}\n                      >\n                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n                          {content.hero.formFields.typeLabel}\n                        </option>\n                        {content.hero.formFields.typeOptions.map((option) => (\n                          <option key={option} value={option} className=\"bg-card text-foreground\">\n                            {option}\n                          </option>\n                        ))}\n                      </select>\n                      <select\n                        required\n                        value={form.climate}\n                        onChange={(e) => setForm({ ...form, climate: e.target.value })}\n                        className={selectClass}\n                      >\n                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n                          {content.hero.formFields.climateLabel}\n                        </option>\n                        {content.hero.formFields.climateOptions.map((option) => (\n                          <option key={option} value={option} className=\"bg-card text-foreground\">\n                            {option}\n                          </option>\n                        ))}\n                      </select>\n                      <input\n                        type=\"number\"\n                        placeholder=\"Roof surface (m²)\"\n                        required\n                        min=\"1\"\n                        value={form.surface}\n                        onChange={(e) => setForm({ ...form, surface: e.target.value })}\n                        className={inputClass}\n                      />\n                      <input\n                        type=\"number\"\n                        placeholder={content.hero.formFields.yearLabel}\n                        required\n                        min=\"1900\"\n                        value={form.year}\n                        onChange={(e) => setForm({ ...form, year: e.target.value })}\n                        className={inputClass}\n                      />\n                      <input\n                        type=\"email\"\n                        placeholder=\"Business email\"\n                        required\n                        value={form.email}\n                        onChange={(e) => setForm({ ...form, email: e.target.value })}\n                        className={inputClass}\n                      />\n\n                      <button\n                        type=\"submit\"\n                        className=\"group mt-1 flex w-full items-center justify-center gap-3 rounded-full cta-gradient py-3 font-semibold text-white active:scale-[0.98]\"\n                      >\n                        <span className=\"text-[15px]\">{content.hero.formFields.cta}</span>\n                        <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n                          <ArrowRight className=\"h-4 w-4\" />\n                        </span>\n                      </button>\n                    </form>\n\n                    <p className=\"mt-3 text-center font-body text-[11px] text-white/35\">\n                      {content.hero.formFields.microcopy}\n                    </p>\n                  </>\n                ) : (\n                  <div className=\"py-4 text-center\">\n                    <div className=\"mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-primary/20\">\n                      <Shield className=\"h-6 w-6 text-primary\" />\n                    </div>\n                    <p className=\"mb-1 font-body text-sm text-white/60\">Indicative budget for {fmt(surfaceNum)} m²</p>\n                    <p className=\"mb-4 font-satoshi text-2xl font-bold text-white\">\n                      €{fmt(estimMin)} - €{fmt(estimMax)}\n                    </p>\n                    <p className=\"mb-4 font-body text-[13px] text-white/50\">\n                      An advisor will contact you within 24 hours with a detailed estimate.\n                    </p>\n                    <button\n                      onClick={() => setSubmitted(false)}\n                      className=\"font-body text-sm font-semibold text-primary hover:underline\"\n                    >\n                      Edit my request\n                    </button>\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div className=\"relative z-10 mt-auto hidden lg:block\">\n        <div className=\"border-t border-white/10 bg-navy/78 py-5 backdrop-blur-md\">\n          <p className=\"mb-3 text-center font-body text-[10px] font-semibold uppercase tracking-[0.2em] text-white/35\">\n            {content.logos.title}\n          </p>\n        </div>\n      </div>\n    </section>\n  );\n};\n\nconst ProblemSection = () => (\n  <section className=\"relative overflow-hidden bg-cream py-20 lg:py-32\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <div className=\"mb-10 grid grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[1.05fr_0.95fr] lg:gap-20\">\n        <div className=\"space-y-6 lg:space-y-9\">\n          <ScrollReveal>\n            <div className=\"flex items-center gap-3\">\n              <span className=\"h-px w-9 bg-terracotta/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-terracotta-dark\">\n                {content.problem.eyebrow}\n              </span>\n            </div>\n          </ScrollReveal>\n          <ScrollReveal>\n            <h2\n              className=\"font-satoshi font-bold text-foreground !leading-[1.05]\"\n              style={{ fontSize: 'clamp(1.875rem, 3.6vw, 2.875rem)', letterSpacing: '-0.025em' }}\n            >\n              {content.problem.title}\n              <br />\n              <span className=\"text-foreground/40\">{content.problem.mutedTitle}</span>\n            </h2>\n          </ScrollReveal>\n        </div>\n        <ScrollReveal>\n          <p className=\"max-w-[560px] font-body text-base leading-relaxed text-foreground/65 lg:ml-auto lg:text-[16px]\">\n            {content.problem.intro}\n          </p>\n        </ScrollReveal>\n      </div>\n\n      <ScrollReveal stagger>\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 lg:gap-5 xl:gap-6\">\n          {content.problem.cards.map((problem) => {\n            const Icon = problem.icon;\n            return (\n              <article\n                key={problem.title}\n                className=\"group overflow-hidden rounded-2xl bg-white shadow-[0_18px_45px_-34px_hsl(var(--navy)/0.28)] ring-1 ring-foreground/[0.05]\"\n              >\n                <div className=\"relative aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n                  <img src={problem.image} alt={problem.alt} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n                  <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-1/2 bg-gradient-to-t from-navy/45 to-transparent\" />\n                  <span className=\"absolute left-4 top-4 flex h-10 w-10 items-center justify-center rounded-full bg-cream/90 text-terracotta-dark shadow-sm\">\n                    <Icon className=\"h-5 w-5\" strokeWidth={1.7} />\n                  </span>\n                </div>\n                <div className=\"px-6 py-7 lg:px-6 lg:py-8\">\n                  <h3 className=\"mb-3 font-satoshi text-[18px] font-bold !leading-tight text-foreground lg:text-[19px]\">\n                    {problem.title}\n                  </h3>\n                  <p className=\"font-body text-[14px] leading-relaxed text-foreground/62 lg:text-[14.5px]\">\n                    {problem.desc}\n                  </p>\n                </div>\n              </article>\n            );\n          })}\n        </div>\n      </ScrollReveal>\n\n      <ScrollReveal>\n        {content.problem.transition && (\n          <p className=\"mx-auto mt-10 max-w-3xl border-t border-foreground/10 pt-6 text-center font-body text-sm leading-relaxed text-foreground/58 lg:mt-14 lg:text-base\">\n            {content.problem.transition}\n          </p>\n        )}\n      </ScrollReveal>\n    </div>\n  </section>\n);\n\nconst SolutionSection = () => (\n  <section className=\"relative overflow-hidden bg-[#142333] py-20 text-white lg:py-32\">\n    <div\n      aria-hidden=\"true\"\n      className=\"absolute inset-0 opacity-[0.55]\"\n      style={{ backgroundImage: 'linear-gradient(115deg, rgba(255,255,255,0.055) 0 1px, transparent 1px 120px)' }}\n    />\n    <div className=\"container relative mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto mb-12 grid max-w-6xl grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[0.88fr_1.12fr] lg:gap-16\">\n          <div>\n            <div className=\"mb-6 inline-flex items-center gap-3\">\n              <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n                {content.solution.eyebrow}\n              </span>\n            </div>\n            <h2\n              className=\"font-satoshi font-bold !leading-[1.04] text-white\"\n              style={{ fontSize: 'clamp(2rem, 3.4vw, 3rem)', letterSpacing: '-0.03em' }}\n            >\n              {content.solution.title}\n              <br />\n              <span className=\"text-white/45\">{content.solution.mutedTitle}</span>\n            </h2>\n          </div>\n          <p className=\"max-w-2xl font-body text-base leading-relaxed text-white/74 lg:text-[17px]\">\n            {content.solution.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n\n      <div className=\"grid grid-cols-1 gap-5 md:grid-cols-2 lg:gap-6\">\n        {[\n          {\n            title: 'Conventional roof',\n            image: classicRoofImage,\n            metric: 'up to 80°C',\n            metricLabel: 'at the surface',\n            points: ['Dark surface', 'Absorbs heat', 'Strains air conditioning'],\n            cool: false,\n          },\n          {\n            title: 'Cool roof',\n            image: coolRoofImage,\n            metric: 'up to 90%',\n            metricLabel: 'of radiation reflected',\n            points: ['Light-colored surface', 'Stays cooler', 'Reduces the thermal load'],\n            cool: true,\n          },\n        ].map((item) => (\n          <article key={item.title} className=\"overflow-hidden rounded-2xl border border-white/10 bg-white/[0.045]\">\n            <div className=\"relative aspect-[1.1] overflow-hidden bg-[#0f1d2a] md:aspect-[1.18]\">\n              <img src={item.image} alt={item.title} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n              <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-2/3 bg-gradient-to-t from-[#142333] via-[#142333]/20 to-transparent\" />\n            </div>\n            <div className=\"p-5 lg:p-7\">\n              <div className=\"mb-6 flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\">\n                <h3 className=\"font-satoshi text-xl font-bold !leading-tight text-white lg:text-2xl\">\n                  {item.title}\n                </h3>\n                <div className={`shrink-0 rounded-xl border px-4 py-3 ${item.cool ? 'border-teal-vivid/18 bg-teal-vivid/10 text-teal-vivid' : 'border-terracotta/18 bg-terracotta/12 text-[#f0a084]'}`}>\n                  <span className=\"block font-satoshi text-2xl font-bold leading-none lg:text-3xl\">{item.metric}</span>\n                  <span className=\"mt-1 block font-body text-[10px] font-bold uppercase tracking-[0.14em] opacity-75\">\n                    {item.metricLabel}\n                  </span>\n                </div>\n              </div>\n              <ul className=\"grid gap-2.5\">\n                {item.points.map((point) => (\n                  <li key={point} className=\"flex items-start gap-2.5\">\n                    <CheckCircle2 className={`mt-0.5 h-4 w-4 shrink-0 ${item.cool ? 'text-teal-vivid' : 'text-[#f0a084]'}`} strokeWidth={2} />\n                    <span className=\"font-body text-sm leading-relaxed text-white/66\">{point}</span>\n                  </li>\n                ))}\n              </ul>\n            </div>\n          </article>\n        ))}\n      </div>\n\n      {(content.solution.points.length > 0 || content.solution.transition) && (\n        <ScrollReveal>\n          <div className=\"mx-auto mt-10 max-w-6xl lg:mt-14\">\n            {content.solution.points.length > 0 && (\n              <ul className=\"grid grid-cols-1 gap-3 md:grid-cols-4\">\n                {content.solution.points.map((point) => (\n                  <li key={point} className=\"flex items-center gap-3 rounded-xl border border-white/10 bg-white/[0.055] px-5 py-4\">\n                    <span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-teal-vivid/12\">\n                      <Check className=\"h-4 w-4 text-teal-vivid\" strokeWidth={1.8} />\n                    </span>\n                    <span className=\"font-body text-sm font-semibold leading-snug text-white/78\">{point}</span>\n                  </li>\n                ))}\n              </ul>\n            )}\n            {content.solution.transition && (\n              <p className=\"mx-auto mt-8 max-w-2xl text-center font-body text-sm leading-relaxed text-white/52\">\n                {content.solution.transition}\n              </p>\n            )}\n          </div>\n        </ScrollReveal>\n      )}\n    </div>\n  </section>\n);\n\nconst DurabilitySection = () => (\n  <section className=\"relative overflow-hidden bg-[#F6FAFB] py-16 lg:py-28\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto mb-12 max-w-2xl text-center lg:mb-16\">\n          <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n            Durability\n          </p>\n          <h2\n            className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\"\n            style={{ fontSize: 'clamp(2rem, 3.2vw, 2.85rem)', letterSpacing: '-0.03em' }}\n          >\n            {content.durability.title}\n          </h2>\n          <p className=\"font-body text-base leading-relaxed text-foreground/62 lg:text-[17px]\">\n            {content.durability.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n\n      <ScrollReveal>\n        <div className=\"mx-auto grid max-w-5xl grid-cols-1 items-stretch gap-5 lg:grid-cols-2 lg:gap-0\">\n          {[\n            {\n              title: 'Standard acrylic coating',\n              subtitle: 'Low cost to apply',\n              price: '~€10',\n              life: '2-5 years',\n              realCost: '€25-30',\n              covalba: false,\n              points: ['Reflectivity drops quickly', 'Chalking and yellowing', 'More frequent reapplication'],\n            },\n            {\n              title: 'Covalba polyurethane system',\n              subtitle: content.durability.covalbaLabel,\n              price: '€18-20',\n              life: '8-10 years',\n              realCost: '€18-20',\n              covalba: true,\n              points: ['Durable polyurethane resin', 'Anti-UV finishing varnish', 'Reflectivity retained longer'],\n            },\n          ].map((option) => (\n            <article\n              key={option.title}\n              className={`relative rounded-2xl px-7 py-9 shadow-[0_20px_60px_rgba(26,42,58,0.08)] lg:px-10 lg:py-12 ${\n                option.covalba ? 'z-10 bg-foreground text-white lg:-ml-5 lg:scale-[1.03]' : 'bg-white text-foreground lg:scale-[0.97] lg:opacity-90'\n              }`}\n            >\n              {option.covalba && (\n                <span className=\"absolute -top-4 left-1/2 inline-flex -translate-x-1/2 items-center rounded-full bg-teal-vivid px-4 py-2 font-body text-[11px] font-bold uppercase tracking-[0.15em] text-white\">\n                  The durable choice\n                </span>\n              )}\n              <h3 className=\"mb-2 font-satoshi text-2xl font-bold leading-tight lg:text-[1.7rem]\">{option.title}</h3>\n              <p className={`mb-8 font-body text-sm ${option.covalba ? 'text-white/52' : 'text-foreground/50'}`}>\n                {option.subtitle}\n              </p>\n              <div className=\"mb-8 grid grid-cols-3 gap-4\">\n                {[\n                  ['Price per m²', option.price],\n                  ['Service life', option.life],\n                  ['Over 10 years', option.realCost],\n                ].map(([label, value]) => (\n                  <div key={label}>\n                    <p className={`mb-1 font-body text-[10px] uppercase tracking-widest ${option.covalba ? 'text-white/42' : 'text-foreground/38'}`}>\n                      {label}\n                    </p>\n                    <p className={`font-satoshi text-2xl font-bold leading-none lg:text-3xl ${label === 'Over 10 years' ? (option.covalba ? 'text-teal-vivid' : 'text-terracotta') : ''}`}>\n                      {value}\n                    </p>\n                  </div>\n                ))}\n              </div>\n              <ul className=\"space-y-3 border-t border-current/10 pt-7\">\n                {option.points.map((point) => {\n                  const Icon = option.covalba ? Check : X;\n                  return (\n                    <li key={point} className=\"flex items-start gap-2.5\">\n                      <Icon className={`mt-0.5 h-4 w-4 shrink-0 ${option.covalba ? 'text-teal-vivid' : 'text-terracotta/70'}`} />\n                      <span className={`font-body text-sm leading-relaxed ${option.covalba ? 'text-white/70' : 'text-foreground/60'}`}>\n                        {point}\n                      </span>\n                    </li>\n                  );\n                })}\n              </ul>\n            </article>\n          ))}\n        </div>\n      </ScrollReveal>\n\n      <ScrollReveal>\n        <p className=\"mx-auto mt-10 max-w-3xl text-center font-body text-sm leading-relaxed text-foreground/55 lg:text-[15px]\">\n          {content.durability.note}\n        </p>\n      </ScrollReveal>\n    </div>\n  </section>\n);\n\nconst ValueSection = () => {\n  const [submitted, setSubmitted] = useState(false);\n\n  return (\n    <section className=\"relative overflow-hidden bg-white py-16 lg:py-28\">\n      <div className=\"container mx-auto px-4 lg:px-8\">\n        <ScrollReveal>\n          <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 items-end gap-7 lg:mb-14 lg:grid-cols-[0.9fr_1.1fr] lg:gap-16\">\n            <div>\n              <div className=\"mb-5 flex items-center gap-3\">\n                <span className=\"h-px w-10 bg-teal-vivid\" aria-hidden=\"true\" />\n                <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n                  {content.value.eyebrow}\n                </span>\n              </div>\n              <h2\n                className=\"font-satoshi font-bold !leading-[1.04] text-foreground\"\n                style={{ fontSize: 'clamp(1.95rem, 3vw, 2.75rem)', letterSpacing: '-0.03em' }}\n              >\n                {content.value.title}\n              </h2>\n            </div>\n            <p className=\"max-w-2xl font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n              {content.value.intro}\n            </p>\n          </div>\n        </ScrollReveal>\n\n        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-5 lg:grid-cols-[0.82fr_1.18fr] lg:gap-7\">\n          <ScrollReveal>\n            <div className=\"h-full rounded-2xl bg-cream/70 p-6 ring-1 ring-foreground/[0.06] lg:p-7\">\n              {!submitted ? (\n                <>\n                  <h3 className=\"mb-5 font-satoshi text-xl font-bold leading-tight text-foreground\">\n                    Estimate my savings\n                  </h3>\n                  <form\n                    className=\"grid gap-3\"\n                    onSubmit={(event) => {\n                      event.preventDefault();\n                      setSubmitted(true);\n                    }}\n                  >\n                    <select required className={lightFieldClass} defaultValue=\"\">\n                      <option value=\"\" disabled>\n                        Building type\n                      </option>\n                      {content.hero.formFields.typeOptions.map((option) => (\n                        <option key={option}>{option}</option>\n                      ))}\n                    </select>\n                    <input required min=\"1\" type=\"number\" className={lightFieldClass} placeholder=\"Roof surface (m²)\" />\n                    <input required type=\"email\" className={lightFieldClass} placeholder=\"Business email\" />\n                    <button className=\"group mt-1 inline-flex items-center justify-center gap-2 rounded-full bg-teal-vivid py-2.5 pl-6 pr-2 font-semibold text-white\">\n                      <span className=\"text-sm\">{content.value.cta}</span>\n                      <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n                        <ArrowRight className=\"h-3.5 w-3.5\" />\n                      </span>\n                    </button>\n                  </form>\n                </>\n              ) : (\n                <div className=\"flex min-h-[260px] flex-col items-center justify-center text-center\">\n                  <CheckCircle2 className=\"mb-4 h-12 w-12 text-teal-vivid\" strokeWidth={1.7} />\n                  <h3 className=\"mb-3 font-satoshi text-2xl font-bold text-foreground\">Request received.</h3>\n                  <p className=\"max-w-sm font-body text-sm leading-relaxed text-foreground/62\">\n                    Covalba will get back to you with a personalized response.\n                  </p>\n                </div>\n              )}\n            </div>\n          </ScrollReveal>\n\n          <ScrollReveal>\n            <div className=\"rounded-2xl bg-foreground p-6 text-white lg:p-8\">\n              <div className=\"grid gap-4 sm:grid-cols-3\">\n                {content.value.milestones.map((milestone) => (\n                  <div key={milestone.label} className=\"rounded-xl border border-white/10 bg-white/[0.04] p-5\">\n                    <p className=\"font-satoshi text-4xl font-bold leading-none text-teal-vivid\">{milestone.value}</p>\n                    <p className=\"mt-3 font-body text-sm text-white/62\">{milestone.label}</p>\n                  </div>\n                ))}\n              </div>\n              <div className=\"mt-6 grid gap-3\">\n                {content.value.points.map((point) => (\n                  <div key={point} className=\"flex items-start gap-3\">\n                    <CheckCircle2 className=\"mt-0.5 h-4 w-4 shrink-0 text-teal-vivid\" />\n                    <span className=\"font-body text-sm leading-relaxed text-white/68\">{point}</span>\n                  </div>\n                ))}\n              </div>\n            </div>\n            <p className=\"mt-5 rounded-2xl bg-cream/70 p-5 font-body text-xs leading-relaxed text-foreground/58 lg:text-[13px]\">\n              {content.value.note}\n            </p>\n          </ScrollReveal>\n        </div>\n      </div>\n    </section>\n  );\n};\n\nconst BenefitsSection = () => (\n  <>\n    <section className=\"relative overflow-hidden bg-cream pb-12 pt-16 lg:min-h-[640px] lg:pb-8 lg:pt-20\">\n      <figure className=\"absolute right-0 top-0 hidden h-full min-h-[640px] w-[58vw] overflow-hidden lg:block\">\n        <img src={content.benefits.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n        <div aria-hidden=\"true\" className=\"absolute inset-y-0 left-0 w-[56%] bg-gradient-to-r from-cream via-cream/88 to-transparent\" />\n      </figure>\n      <div className=\"container relative z-10 mx-auto px-4 lg:px-8\">\n        <ScrollReveal>\n          <div className=\"max-w-[760px]\">\n            <div className=\"mb-5 flex items-center gap-3 lg:mb-7\">\n              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n                {content.benefits.eyebrow}\n              </span>\n            </div>\n            <h2\n              className=\"mb-6 font-satoshi font-bold !leading-[1.04] text-foreground\"\n              style={{ fontSize: 'clamp(2.15rem, 3vw, 3rem)' }}\n            >\n              {content.benefits.title}\n            </h2>\n            <p className=\"max-w-[540px] font-body text-base leading-relaxed text-foreground/72 lg:text-[16px]\">\n              {content.benefits.desc}\n            </p>\n            <div className=\"relative z-10 mt-7 max-w-[540px] rounded-2xl bg-white/96 p-6 shadow-[0_22px_70px_-45px_hsl(var(--navy)/0.35)] ring-1 ring-foreground/[0.05]\">\n              <div className=\"grid grid-cols-[48px_minmax(0,1fr)] items-center gap-5\">\n                <Thermometer className=\"h-12 w-12 text-primary\" strokeWidth={1.55} />\n                <div>\n                  <p className=\"mb-3 font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n                    From the very first summer\n                  </p>\n                  <p className=\"font-satoshi text-[3.1rem] font-bold leading-[0.88] text-primary\">{content.benefits.metric}</p>\n                  <p className=\"mt-2 font-satoshi text-xl font-bold leading-tight text-foreground\">{content.benefits.metricLabel}</p>\n                </div>\n              </div>\n            </div>\n          </div>\n        </ScrollReveal>\n      </div>\n    </section>\n\n    <section className=\"relative overflow-hidden bg-white py-14\">\n      <div className=\"container relative mx-auto px-4 lg:px-8\">\n        <ScrollReveal stagger>\n          <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5 lg:gap-4\">\n            {content.benefits.cards.map((benefit, index) => {\n              const Icon = benefit.icon;\n              return (\n                <article key={benefit.title} className=\"min-h-[184px] rounded-2xl bg-cream/65 p-5 ring-1 ring-foreground/[0.05] lg:p-6\">\n                  <div className=\"mb-7 flex h-11 w-11 items-center justify-center rounded-xl bg-white text-primary\">\n                    <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n                  </div>\n                  <span className=\"mb-3 block font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary/70\">\n                    0{index + 1}\n                  </span>\n                  <h3 className=\"font-satoshi text-lg font-bold leading-tight text-foreground lg:text-[19px]\">{benefit.title}</h3>\n                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/62\">{benefit.desc}</p>\n                </article>\n              );\n            })}\n          </div>\n        </ScrollReveal>\n        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n          {content.benefits.transition}\n        </p>\n      </div>\n    </section>\n  </>\n);\n\nconst ApplicationsSection = () => (\n  <section className=\"relative overflow-hidden bg-cream py-16 lg:py-24\">\n    <div className=\"container relative mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 gap-6 lg:mb-12 lg:grid-cols-[0.9fr_1.1fr] lg:items-end lg:gap-16\">\n          <div>\n            <div className=\"mb-5 flex items-center gap-3\">\n              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n                {content.applications.eyebrow}\n              </span>\n            </div>\n            <h2\n              className=\"font-satoshi font-bold !leading-[1.05] text-foreground\"\n              style={{ fontSize: 'clamp(2rem, 3vw, 3rem)' }}\n            >\n              {content.applications.title}\n            </h2>\n          </div>\n          <p className=\"max-w-[540px] border-l border-primary/30 pl-6 font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n            {content.applications.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n      <ScrollReveal stagger>\n        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-4 lg:grid-cols-5 lg:gap-5\">\n          {content.applications.cards.map((card, index) => {\n            const Icon = card.icon;\n            return (\n              <article key={card.title} className=\"overflow-hidden rounded-2xl bg-white shadow-[0_16px_46px_-38px_hsl(var(--navy)/0.34)] ring-1 ring-foreground/[0.06]\">\n                <div className=\"aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n                  <img src={card.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n                </div>\n                <div className=\"p-5\">\n                  <div className=\"mb-4 flex items-center justify-between gap-3\">\n                    <span className=\"inline-flex items-center gap-2 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary\">\n                      <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n                      {card.label}\n                    </span>\n                    <span className=\"font-body text-xs font-bold text-foreground/22\">0{index + 1}</span>\n                  </div>\n                  <h3 className=\"font-satoshi text-xl font-bold leading-tight text-foreground\">{card.title}</h3>\n                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/60\">{card.desc}</p>\n                </div>\n              </article>\n            );\n          })}\n        </div>\n      </ScrollReveal>\n      {content.applications.transition && (\n        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n          {content.applications.transition}\n        </p>\n      )}\n    </div>\n  </section>\n);\n\nconst MethodSection = () => {\n  const [videoOpen, setVideoOpen] = useState(false);\n  const icons = [ClipboardCheck, CalendarClock, Shield, TrendingDown];\n  return (\n    <section className=\"bg-white py-16 lg:py-32\">\n      <div className=\"container mx-auto px-4 lg:px-8\">\n        <div className=\"flex flex-col items-start gap-12 lg:flex-row lg:gap-20\">\n          <div className=\"lg:sticky lg:top-[120px] lg:w-[40%]\">\n            <ScrollReveal>\n              <p className=\"mb-6 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/50\">\n                {content.method.eyebrow}\n              </p>\n              <h2\n                className=\"mb-6 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] sm:text-4xl lg:text-[3rem]\"\n                style={{ letterSpacing: '-0.03em' }}\n              >\n                {content.method.title}\n                <span className=\"text-foreground/30\"> {content.method.mutedTitle}</span>\n              </h2>\n              <p className=\"mb-8 font-body text-base leading-relaxed text-muted-foreground lg:text-lg\">\n                {content.method.intro}\n              </p>\n              <button onClick={() => setVideoOpen(true)} className=\"group flex items-center gap-3 text-primary\">\n                <div className=\"flex h-12 w-12 items-center justify-center rounded-full bg-primary/10\">\n                  <Play className=\"h-5 w-5\" />\n                </div>\n                <span className=\"font-body text-sm font-semibold\">Watch a project in 2 minutes</span>\n              </button>\n            </ScrollReveal>\n          </div>\n          <div className=\"relative lg:w-[60%]\">\n            <div className=\"absolute bottom-4 left-5 top-4 w-px bg-gradient-to-b from-primary/25 via-primary/10 to-transparent lg:left-6\" />\n            {content.method.steps.map((step, index) => {\n              const Icon = icons[index] ?? ClipboardCheck;\n              return (\n                <ScrollReveal key={step.title}>\n                  <div className=\"group relative flex items-start gap-5 py-8 lg:gap-7 lg:py-10\">\n                    <div className=\"relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full border border-primary/20 bg-primary/10 lg:h-12 lg:w-12\">\n                      <Icon className=\"h-4 w-4 text-primary lg:h-5 lg:w-5\" />\n                    </div>\n                    <div className=\"pt-1\">\n                      <span className=\"mb-2 block font-body text-xs font-bold uppercase tracking-widest text-primary/50\">\n                        Step 0{index + 1}\n                      </span>\n                      <h3 className=\"mb-2 text-xl text-foreground lg:text-2xl\">{step.title}</h3>\n                      <p className=\"max-w-md font-body text-sm leading-relaxed text-muted-foreground lg:text-base\">{step.text}</p>\n                    </div>\n                  </div>\n                  {index < content.method.steps.length - 1 && <div className=\"ml-5 h-px bg-border lg:ml-6\" />}\n                </ScrollReveal>\n              );\n            })}\n            <p className=\"ml-16 mt-4 font-body text-xs font-medium text-muted-foreground/50 lg:ml-20\">\n              {content.method.duration}\n            </p>\n          </div>\n        </div>\n      </div>\n      <Dialog open={videoOpen} onOpenChange={setVideoOpen}>\n        <DialogContent className=\"max-w-4xl overflow-hidden border-none bg-black p-0\">\n          <div className=\"aspect-video\">\n            <iframe\n              src=\"https://www.youtube.com/embed/9HOB5OVH0Ac?autoplay=1\"\n              className=\"h-full w-full\"\n              allow=\"autoplay; encrypted-media\"\n              allowFullScreen\n              title=\"Covalba Cool Roof, a project in 2 minutes\"\n            />\n          </div>\n        </DialogContent>\n      </Dialog>\n    </section>\n  );\n};\n\nconst ProofSection = () => (\n  <section className=\"relative overflow-hidden bg-[#192A3A] py-24 lg:py-36\">\n    <div className=\"container relative mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mb-9 flex items-center gap-3 lg:mb-12\">\n          <span className=\"h-px w-12 bg-teal-vivid/70\" aria-hidden=\"true\" />\n          <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n            {content.proof.eyebrow}\n          </span>\n        </div>\n        <div className=\"mb-14 grid grid-cols-1 items-start gap-8 lg:mb-20 lg:grid-cols-[3fr_2fr] lg:gap-16\">\n          <h2\n            className=\"font-satoshi font-bold text-white !leading-[1.05]\"\n            style={{ fontSize: 'clamp(1.875rem, 3.8vw, 3rem)', letterSpacing: '-0.03em' }}\n          >\n            {content.proof.title}\n            <br />\n            <span className=\"text-teal-vivid\">{content.proof.mutedTitle}</span>\n          </h2>\n          <p className=\"max-w-[470px] font-body text-base leading-relaxed text-white/65 lg:mt-2 lg:text-[16px]\">\n            {content.proof.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n      <ScrollReveal stagger>\n        <div className=\"grid grid-cols-1 gap-4 md:grid-cols-3 lg:gap-5\">\n          {content.proof.figures.map((figure) => {\n            const Icon = figure.icon;\n            return (\n              <div key={figure.label} className=\"rounded-2xl border border-white/10 bg-white/[0.04] p-8 lg:p-9\">\n                <div className=\"mb-6 flex h-11 w-11 items-center justify-center rounded-full bg-teal-vivid/[0.12]\">\n                  <Icon className=\"h-5 w-5 text-teal-vivid\" strokeWidth={1.6} />\n                </div>\n                <p className=\"mb-3 font-satoshi text-4xl font-bold leading-none text-white\">{figure.value}</p>\n                <p className=\"font-body text-sm leading-relaxed text-white/60\">{figure.label}</p>\n              </div>\n            );\n          })}\n        </div>\n      </ScrollReveal>\n      <div className=\"mt-12 border-t border-white/10 pt-10\">\n        <p className=\"mx-auto max-w-2xl text-center font-body text-sm leading-relaxed text-white/70\">\n          {content.proof.transition}\n        </p>\n      </div>\n    </div>\n  </section>\n);\n\nconst FaqSection = () => (\n  <section className=\"bg-cream py-20 lg:py-32\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"grid items-start gap-10 lg:grid-cols-[0.85fr_1.15fr] lg:gap-16\">\n          <div className=\"lg:sticky lg:top-24\">\n            <div className=\"mb-5 flex items-center gap-3\">\n              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">FAQ</span>\n            </div>\n            <h2 className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\" style={{ fontSize: 'clamp(2rem, 3.3vw, 3rem)', letterSpacing: '-0.03em' }}>\n              Your questions,\n              <br />\n              <span className=\"text-foreground/40\">our answers.</span>\n            </h2>\n            <p className=\"max-w-[420px] font-body text-base leading-relaxed text-foreground/65 lg:text-[15.5px]\">\n              {content.faq.intro}\n            </p>\n            <a href={`#contact-${SLUG}`} className=\"group mt-8 inline-flex items-center gap-2 text-sm font-semibold text-primary\">\n              Another question? Let's talk\n              <ArrowRight className=\"h-4 w-4\" />\n            </a>\n          </div>\n          <Accordion type=\"single\" collapsible className=\"space-y-3\">\n            {content.faq.items.map((faq, index) => (\n              <AccordionItem key={faq.q} value={`${SLUG}-faq-${index}`} className=\"rounded-xl border border-foreground/[0.06] bg-white px-5 shadow-[0_12px_34px_rgba(24,42,58,0.04)] lg:px-6\">\n                <AccordionTrigger className=\"py-5 text-left font-satoshi text-base font-bold text-foreground hover:no-underline lg:text-[17px]\">\n                  {faq.q}\n                </AccordionTrigger>\n                <AccordionContent className=\"pb-5 font-body text-[14.5px] leading-relaxed text-foreground/67 lg:text-[15px]\">\n                  {faq.a}\n                </AccordionContent>\n              </AccordionItem>\n            ))}\n          </Accordion>\n        </div>\n      </ScrollReveal>\n    </div>\n  </section>\n);\n\nconst FinalCta = () => (\n  <section id={`contact-${SLUG}`} className=\"overflow-hidden bg-[#182A3A] py-20 lg:py-32\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto max-w-4xl text-center\">\n          <div className=\"mb-6 inline-flex items-center gap-3\">\n            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n            <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n              {content.finalCta.eyebrow}\n            </span>\n            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n          </div>\n          <h2 className=\"mb-6 font-satoshi font-bold text-white !leading-[1.04]\" style={{ fontSize: 'clamp(2rem, 3.8vw, 3.5rem)', letterSpacing: '-0.03em' }}>\n            {content.finalCta.title}\n          </h2>\n          <p className=\"mx-auto mb-9 max-w-2xl font-body text-base leading-relaxed text-white/[0.72] lg:text-[17px]\">\n            {content.finalCta.desc}\n          </p>\n          <div className=\"flex flex-col items-stretch justify-center gap-3 sm:flex-row sm:items-center\">\n            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full cta-gradient py-2.5 pl-6 pr-2 font-semibold text-white\">\n              <span className=\"text-sm\">Request a quote</span>\n              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20\">\n                <ArrowRight className=\"h-3.5 w-3.5\" />\n              </span>\n            </a>\n            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full border border-white/[0.22] py-2.5 pl-6 pr-2 font-semibold text-white/[0.88]\">\n              <span className=\"text-sm\">Talk to an expert</span>\n              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/[0.12]\">\n                <ArrowRight className=\"h-3.5 w-3.5\" />\n              </span>\n            </a>\n          </div>\n        </div>\n      </ScrollReveal>\n      <ul className=\"mx-auto mt-12 grid max-w-3xl gap-3 sm:grid-cols-3\">\n        {content.finalCta.reassurances.map((item, index) => {\n          const icons = [CalendarCheck, BadgeCheck, Shield];\n          const Icon = icons[index] ?? BadgeCheck;\n          return (\n            <li key={item} className=\"flex items-center justify-center gap-2.5 rounded-lg border border-white/[0.12] bg-white/[0.045] px-4 py-3\">\n              <Icon className=\"h-4 w-4 shrink-0 text-teal-vivid\" strokeWidth={1.8} />\n              <span className=\"font-body text-sm text-white/[0.76]\">{item}</span>\n            </li>\n          );\n        })}\n      </ul>\n    </div>\n  </section>\n);\n\nconst SeoContent = () => (\n  <section className=\"bg-cream py-16 lg:py-28\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <div className=\"mx-auto max-w-5xl\">\n        <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n          {content.seo.eyebrow}\n        </p>\n        <h2 className=\"mb-5 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] lg:text-5xl\">\n          {content.seo.title}\n        </h2>\n        <p className=\"mb-12 max-w-3xl font-body text-base leading-relaxed text-foreground/64\">\n          {content.seo.intro}\n        </p>\n        <div className=\"grid gap-10 md:grid-cols-2\">\n          {content.seo.sections.map((section) => (\n            <article key={section.title}>\n              <h3 className=\"mb-3 font-satoshi text-xl font-bold text-foreground\">{section.title}</h3>\n              <p className=\"font-body text-sm leading-relaxed text-foreground/68\">{section.body}</p>\n            </article>\n          ))}\n        </div>\n        <div className=\"mt-12 border-t border-foreground/10 pt-8\">\n          <p className=\"mb-4 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-foreground/38\">Sources</p>\n          <ul className=\"grid gap-2 font-body text-xs leading-relaxed text-foreground/50 md:grid-cols-2\">\n            {content.seo.sources.map((source) => (\n              <li key={source}>{source}</li>\n            ))}\n          </ul>\n        </div>\n      </div>\n    </div>\n  </section>\n);\n\nconst CommercialEN = () => (\n  <>\n    <NavbarEN />\n    <main>\n      <Seo />\n      <SectorHero />\n      <ProblemSection />\n      <SolutionSection />\n      <DurabilitySection />\n      <ValueSection />\n      <BenefitsSection />\n      <ApplicationsSection />\n      <MethodSection />\n      <ProofSection />\n      <FaqSection />\n      <FinalCta />\n      <SeoContent />\n    </main>\n    <FooterEN />\n    <StickyMobileCTAEN />\n  </>\n);\n\nexport default CommercialEN;\n","numLines":1310,"startLine":1,"totalLines":1310}},"sourceToolAssistantUUID":"d16105d8-8080-48a8-a62a-d8bd4e3470f4","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"e1a6bdfb-7855-42c8-a46d-9b8a12907069","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01BnJiZeCo49erGM1LoKzh5Y","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01Ac1CKQkY7UAztuYcrBCHon","name":"Read","input":{"file_path":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/components/en/industries/SectorPageTemplateEN.tsx"},"caller":{"type":"direct"}}],"stop_reason":"tool_use","stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2756,"cache_creation_input_tokens":35005,"cache_read_input_tokens":15028,"output_tokens":226,"server_tool_use":{"web_search_requests":0,"web_fetch_requests":0},"service_tier":"standard","cache_creation":{"ephemeral_1h_input_tokens":0,"ephemeral_5m_input_tokens":35005},"inference_geo":"not_available","iterations":[{"input_tokens":2756,"output_tokens":226,"cache_read_input_tokens":15028,"cache_creation_input_tokens":35005,"cache_creation":{"ephemeral_5m_input_tokens":35005,"ephemeral_1h_input_tokens":0},"type":"message"}],"speed":"standard"},"diagnostics":null},"requestId":"req_011CcHEzjcgyZ62mEGkzjWnB","attributionAgent":"general-purpose","type":"assistant","uuid":"8fdeb9df-0f26-46cb-8e2e-2a0f5cdd4c67","timestamp":"2026-06-21T23:05:08.980Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"8fdeb9df-0f26-46cb-8e2e-2a0f5cdd4c67","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_01Ac1CKQkY7UAztuYcrBCHon","type":"tool_result","content":"1\timport { useState } from 'react';\n2\timport {\n3\t  ArrowRight,\n4\t  BadgeCheck,\n5\t  Building2,\n6\t  CalendarCheck,\n7\t  CalendarClock,\n8\t  Check,\n9\t  CheckCircle2,\n10\t  ClipboardCheck,\n11\t  HelpCircle,\n12\t  Play,\n13\t  Shield,\n14\t  Thermometer,\n15\t  TrendingDown,\n16\t  UsersRound,\n17\t  X,\n18\t} from 'lucide-react';\n19\timport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';\n20\timport { Dialog, DialogContent } from '@/components/ui/dialog';\n21\timport ScrollReveal from '@/components/ScrollReveal';\n22\timport { type SectorPageConfig } from '@/components/industries/SectorPageTemplate';\n23\timport { useJsonLd, usePageMeta } from '@/hooks/usePageMeta';\n24\timport classicRoofImage from '@/assets/industrie/logistique-solution-classic.webp';\n25\timport coolRoofImage from '@/assets/industrie/logistique-solution-coolroof.webp';\n26\t\n27\tconst SITE_URL = 'https://www.covalba.fr';\n28\t\n29\tconst inputClass =\n30\t  'w-full rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white placeholder:text-white/40 transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n31\t\n32\tconst selectClass =\n33\t  'w-full appearance-none rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n34\t\n35\tconst lightFieldClass =\n36\t  'w-full rounded-xl border border-foreground/10 bg-white px-4 py-3 font-body text-sm text-foreground outline-none transition-all focus:border-teal-vivid/40 focus:ring-2 focus:ring-teal-vivid/15';\n37\t\n38\tconst Seo = ({ config }: { config: SectorPageConfig }) => {\n39\t  const pageUrl = `${SITE_URL}${config.canonicalPath}`;\n40\t  usePageMeta({ title: config.title, description: config.description, canonical: pageUrl });\n41\t  useJsonLd(`${config.slug}-en-breadcrumb-schema`, {\n42\t    '@context': 'https://schema.org',\n43\t    '@type': 'BreadcrumbList',\n44\t    itemListElement: [\n45\t      { '@type': 'ListItem', position: 1, name: 'Home', item: `${SITE_URL}/en` },\n46\t      { '@type': 'ListItem', position: 2, name: 'Industries', item: `${SITE_URL}/en` },\n47\t      { '@type': 'ListItem', position: 3, name: config.serviceName, item: pageUrl },\n48\t    ],\n49\t  });\n50\t  useJsonLd(`${config.slug}-en-service-schema`, {\n51\t    '@context': 'https://schema.org',\n52\t    '@type': 'Service',\n53\t    name: config.serviceName,\n54\t    serviceType: 'Reflective roof coating',\n55\t    provider: { '@type': 'Organization', name: 'Covalba', url: SITE_URL },\n56\t    areaServed: { '@type': 'Country', name: 'France' },\n57\t    description: config.serviceDescription,\n58\t    audience: { '@type': 'BusinessAudience', audienceType: config.audience },\n59\t  });\n60\t  return null;\n61\t};\n62\t\n63\tconst ReassuranceBand = ({ items }: { items?: string[] }) => {\n64\t  if (!items?.length) return null;\n65\t\n66\t  return (\n67\t    <section className=\"border-y border-foreground/[0.06] bg-white py-4\">\n68\t      <div className=\"container mx-auto px-4 lg:px-8\">\n69\t        <ul className=\"flex flex-col items-start justify-center gap-3 font-body text-sm font-semibold text-foreground/62 sm:flex-row sm:flex-wrap sm:items-center sm:gap-x-6 sm:gap-y-2\">\n70\t          {items.map((item) => (\n71\t            <li key={item} className=\"flex items-center gap-2.5\">\n72\t              <CheckCircle2 className=\"h-4 w-4 shrink-0 text-teal-vivid\" strokeWidth={1.8} />\n73\t              <span>{item}</span>\n74\t            </li>\n75\t          ))}\n76\t        </ul>\n77\t      </div>\n78\t    </section>\n79\t  );\n80\t};\n81\t\n82\tconst SectorHero = ({ config }: { config: SectorPageConfig }) => {\n83\t  const [form, setForm] = useState({ type: '', climate: '', surface: '', year: '', email: '' });\n84\t  const [submitted, setSubmitted] = useState(false);\n85\t  const surfaceNum = parseFloat(form.surface) || 0;\n86\t  const estimMin = surfaceNum * 18;\n87\t  const estimMax = surfaceNum * 25;\n88\t  const fmt = (n: number) => new Intl.NumberFormat('en-US').format(n);\n89\t\n90\t  return (\n91\t    <section\n92\t      aria-labelledby={`${config.slug}-hero-title`}\n93\t      className=\"relative isolate flex min-h-[100svh] flex-col overflow-hidden bg-navy text-cream\"\n94\t    >\n95\t      <img\n96\t        src={config.hero.image}\n97\t        alt={config.hero.imageAlt}\n98\t        className=\"absolute inset-0 -z-10 size-full scale-[1.02] object-cover\"\n99\t        loading=\"eager\"\n100\t        decoding=\"async\"\n101\t      />\n102\t      <div\n103\t        aria-hidden=\"true\"\n104\t        className=\"absolute inset-0 -z-10 hidden bg-gradient-to-r from-navy/[0.92] via-navy/55 to-navy/25 lg:block\"\n105\t      />\n106\t      <div\n107\t        aria-hidden=\"true\"\n108\t        className=\"absolute inset-0 -z-10 bg-gradient-to-b from-navy/80 via-navy/22 to-navy/95 lg:hidden\"\n109\t      />\n110\t      <div\n111\t        aria-hidden=\"true\"\n112\t        className=\"absolute inset-x-0 bottom-0 -z-10 h-[28%] bg-gradient-to-t from-navy via-navy/85 to-transparent\"\n113\t      />\n114\t\n115\t      <div className=\"container relative z-10 mx-auto flex flex-1 items-center px-6 pb-10 pt-24 lg:px-12 lg:pb-16 lg:pt-28\">\n116\t        <div className=\"grid w-full grid-cols-1 items-center gap-10 lg:grid-cols-[55fr_45fr] lg:gap-12\">\n117\t          <div className=\"max-w-2xl space-y-6 lg:space-y-8\">\n118\t            {config.hero.eyebrow && (\n119\t              <div className=\"flex items-center gap-3\">\n120\t                <span className=\"h-px w-9 bg-teal-vivid\" aria-hidden=\"true\" />\n121\t                <span className=\"font-body text-[11px] font-semibold uppercase tracking-[0.22em] text-teal-vivid\">\n122\t                  {config.hero.eyebrow}\n123\t                </span>\n124\t              </div>\n125\t            )}\n126\t\n127\t            <h1\n128\t              id={`${config.slug}-hero-title`}\n129\t              className=\"font-satoshi font-bold leading-[1.02] text-white\"\n130\t              style={{ fontSize: 'clamp(2.25rem, 4.6vw, 4rem)', letterSpacing: '-0.03em' }}\n131\t            >\n132\t              {config.hero.h1}\n133\t            </h1>\n134\t\n135\t            <p\n136\t              className=\"max-w-xl font-satoshi font-medium leading-[1.3] text-cream/65\"\n137\t              style={{ fontSize: 'clamp(1rem, 1.5vw, 1.375rem)', letterSpacing: '-0.005em' }}\n138\t            >\n139\t              {config.hero.sub}\n140\t            </p>\n141\t\n142\t            <ul className=\"hidden gap-4 pt-1 sm:flex sm:flex-wrap lg:gap-6\" aria-label=\"Key benefits\">\n143\t              {config.hero.stats.map((stat, index) => {\n144\t                const Icon = stat.icon;\n145\t                return (\n146\t                  <li\n147\t                    key={stat.label}\n148\t                    className={`flex items-start gap-3 ${\n149\t                      index !== 0 ? 'sm:border-l sm:border-white/10 sm:pl-6' : ''\n150\t                    }`}\n151\t                  >\n152\t                    <Icon className=\"mt-0.5 h-[18px] w-[18px] shrink-0 text-teal-vivid\" strokeWidth={1.5} />\n153\t                    <div className=\"leading-tight\">\n154\t                      <p className=\"font-satoshi text-[15px] font-bold text-white lg:text-base\">{stat.value}</p>\n155\t                      <p className=\"mt-1 font-body text-[12.5px] text-cream/55 lg:text-[13px]\">{stat.label}</p>\n156\t                    </div>\n157\t                  </li>\n158\t                );\n159\t              })}\n160\t            </ul>\n161\t          </div>\n162\t\n163\t          <div className=\"animate-hero-stats\">\n164\t            <div className=\"rounded-[1.5rem] border border-white/[0.08] bg-white/[0.04] p-1.5 backdrop-blur-sm\">\n165\t              <div className=\"rounded-[calc(1.5rem-6px)] border border-white/[0.06] bg-[#0b1a2b]/80 p-4 shadow-[inset_0_1px_1px_rgba(255,255,255,0.06)] backdrop-blur-xl lg:p-7\">\n166\t                {!submitted ? (\n167\t                  <>\n168\t                    <h2 className=\"mb-1 text-center font-satoshi text-xl font-bold text-white lg:text-2xl\">\n169\t                      {config.hero.formTitle}\n170\t                    </h2>\n171\t                    <p className=\"mb-4 text-center font-body text-[12px] text-white/50\">\n172\t                      {config.hero.formSubtitle}\n173\t                    </p>\n174\t                    <form\n175\t                      onSubmit={(event) => {\n176\t                        event.preventDefault();\n177\t                        setSubmitted(true);\n178\t                      }}\n179\t                      className=\"space-y-2.5 lg:space-y-3\"\n180\t                    >\n181\t                      <select\n182\t                        required\n183\t                        value={form.type}\n184\t                        onChange={(e) => setForm({ ...form, type: e.target.value })}\n185\t                        className={selectClass}\n186\t                      >\n187\t                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n188\t                          {config.hero.formFields.typeLabel}\n189\t                        </option>\n190\t                        {config.hero.formFields.typeOptions.map((option) => (\n191\t                          <option key={option} value={option} className=\"bg-card text-foreground\">\n192\t                            {option}\n193\t                          </option>\n194\t                        ))}\n195\t                      </select>\n196\t                      <select\n197\t                        required\n198\t                        value={form.climate}\n199\t                        onChange={(e) => setForm({ ...form, climate: e.target.value })}\n200\t                        className={selectClass}\n201\t                      >\n202\t                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n203\t                          {config.hero.formFields.climateLabel}\n204\t                        </option>\n205\t                        {config.hero.formFields.climateOptions.map((option) => (\n206\t                          <option key={option} value={option} className=\"bg-card text-foreground\">\n207\t                            {option}\n208\t                          </option>\n209\t                        ))}\n210\t                      </select>\n211\t                      <input\n212\t                        type=\"number\"\n213\t                        placeholder=\"Roof surface (m²)\"\n214\t                        required\n215\t                        min=\"1\"\n216\t                        value={form.surface}\n217\t                        onChange={(e) => setForm({ ...form, surface: e.target.value })}\n218\t                        className={inputClass}\n219\t                      />\n220\t                      <input\n221\t                        type=\"number\"\n222\t                        placeholder={config.hero.formFields.yearLabel}\n223\t                        required\n224\t                        min=\"1900\"\n225\t                        value={form.year}\n226\t                        onChange={(e) => setForm({ ...form, year: e.target.value })}\n227\t                        className={inputClass}\n228\t                      />\n229\t                      <input\n230\t                        type=\"email\"\n231\t                        placeholder=\"Business email\"\n232\t                        required\n233\t                        value={form.email}\n234\t                        onChange={(e) => setForm({ ...form, email: e.target.value })}\n235\t                        className={inputClass}\n236\t                      />\n237\t\n238\t                      <button\n239\t                        type=\"submit\"\n240\t                        className=\"group mt-1 flex w-full items-center justify-center gap-3 rounded-full cta-gradient py-3 font-semibold text-white active:scale-[0.98]\"\n241\t                      >\n242\t                        <span className=\"text-[15px]\">{config.hero.formFields.cta}</span>\n243\t                        <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n244\t                          <ArrowRight className=\"h-4 w-4\" />\n245\t                        </span>\n246\t                      </button>\n247\t                    </form>\n248\t\n249\t                    <p className=\"mt-3 text-center font-body text-[11px] text-white/35\">\n250\t                      {config.hero.formFields.microcopy}\n251\t                    </p>\n252\t                  </>\n253\t                ) : (\n254\t                  <div className=\"py-4 text-center\">\n255\t                    <div className=\"mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-primary/20\">\n256\t                      <Shield className=\"h-6 w-6 text-primary\" />\n257\t                    </div>\n258\t                    <p className=\"mb-1 font-body text-sm text-white/60\">Indicative budget for {fmt(surfaceNum)} m²</p>\n259\t                    <p className=\"mb-4 font-satoshi text-2xl font-bold text-white\">\n260\t                      €{fmt(estimMin)} - €{fmt(estimMax)}\n261\t                    </p>\n262\t                    <p className=\"mb-4 font-body text-[13px] text-white/50\">\n263\t                      An advisor will get back to you within 24 hours with a detailed estimate.\n264\t                    </p>\n265\t                    <button\n266\t                      onClick={() => setSubmitted(false)}\n267\t                      className=\"font-body text-sm font-semibold text-primary hover:underline\"\n268\t                    >\n269\t                      Edit my request\n270\t                    </button>\n271\t                  </div>\n272\t                )}\n273\t              </div>\n274\t            </div>\n275\t          </div>\n276\t        </div>\n277\t      </div>\n278\t\n279\t      <div className=\"relative z-10 mt-auto hidden lg:block\">\n280\t        <div className=\"border-t border-white/10 bg-navy/78 py-5 backdrop-blur-md\">\n281\t          <p className=\"mb-3 text-center font-body text-[10px] font-semibold uppercase tracking-[0.2em] text-white/35\">\n282\t            {config.logos.title}\n283\t          </p>\n284\t          <div className=\"mx-auto flex max-w-6xl flex-nowrap items-center justify-center gap-x-8 px-8 xl:gap-x-12\">\n285\t            {config.logos.items.map((logo) =>\n286\t              logo.url ? (\n287\t                <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center\">\n288\t                  <img\n289\t                    src={logo.url}\n290\t                    alt={logo.name}\n291\t                    className=\"max-h-7 max-w-full object-contain opacity-45 transition-opacity duration-300 hover:opacity-75\"\n292\t                    style={{ filter: 'brightness(0) invert(1)' }}\n293\t                    loading=\"lazy\"\n294\t                    decoding=\"async\"\n295\t                  />\n296\t                </span>\n297\t              ) : (\n298\t                <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center whitespace-nowrap font-satoshi text-base font-bold text-white/50 xl:text-lg\">\n299\t                  {logo.name}\n300\t                </span>\n301\t              )\n302\t            )}\n303\t          </div>\n304\t        </div>\n305\t      </div>\n306\t    </section>\n307\t  );\n308\t};\n309\t\n310\tconst ProblemSection = ({ config }: { config: SectorPageConfig }) => (\n311\t  <section className=\"relative overflow-hidden bg-cream py-20 lg:py-32\">\n312\t    <div className=\"container mx-auto px-4 lg:px-8\">\n313\t      <div className=\"mb-10 grid grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[1.05fr_0.95fr] lg:gap-20\">\n314\t        <div className=\"space-y-6 lg:space-y-9\">\n315\t          <ScrollReveal>\n316\t            <div className=\"flex items-center gap-3\">\n317\t              <span className=\"h-px w-9 bg-terracotta/70\" aria-hidden=\"true\" />\n318\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-terracotta-dark\">\n319\t                {config.problem.eyebrow}\n320\t              </span>\n321\t            </div>\n322\t          </ScrollReveal>\n323\t          <ScrollReveal>\n324\t            <h2\n325\t              className=\"font-satoshi font-bold text-foreground !leading-[1.05]\"\n326\t              style={{ fontSize: 'clamp(1.875rem, 3.6vw, 2.875rem)', letterSpacing: '-0.025em' }}\n327\t            >\n328\t              {config.problem.title}\n329\t              <br />\n330\t              <span className=\"text-foreground/40\">{config.problem.mutedTitle}</span>\n331\t            </h2>\n332\t          </ScrollReveal>\n333\t        </div>\n334\t        <ScrollReveal>\n335\t          <p className=\"max-w-[560px] font-body text-base leading-relaxed text-foreground/65 lg:ml-auto lg:text-[16px]\">\n336\t            {config.problem.intro}\n337\t          </p>\n338\t        </ScrollReveal>\n339\t      </div>\n340\t\n341\t      <ScrollReveal stagger>\n342\t        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 lg:gap-5 xl:gap-6\">\n343\t          {config.problem.cards.map((problem) => {\n344\t            const Icon = problem.icon;\n345\t            return (\n346\t              <article\n347\t                key={problem.title}\n348\t                className=\"group overflow-hidden rounded-2xl bg-white shadow-[0_18px_45px_-34px_hsl(var(--navy)/0.28)] ring-1 ring-foreground/[0.05]\"\n349\t              >\n350\t                <div className=\"relative aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n351\t                  <img src={problem.image} alt={problem.alt} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n352\t                  <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-1/2 bg-gradient-to-t from-navy/45 to-transparent\" />\n353\t                  <span className=\"absolute left-4 top-4 flex h-10 w-10 items-center justify-center rounded-full bg-cream/90 text-terracotta-dark shadow-sm\">\n354\t                    <Icon className=\"h-5 w-5\" strokeWidth={1.7} />\n355\t                  </span>\n356\t                </div>\n357\t                <div className=\"px-6 py-7 lg:px-6 lg:py-8\">\n358\t                  <h3 className=\"mb-3 font-satoshi text-[18px] font-bold !leading-tight text-foreground lg:text-[19px]\">\n359\t                    {problem.title}\n360\t                  </h3>\n361\t                  <p className=\"font-body text-[14px] leading-relaxed text-foreground/62 lg:text-[14.5px]\">\n362\t                    {problem.desc}\n363\t                  </p>\n364\t                </div>\n365\t              </article>\n366\t            );\n367\t          })}\n368\t        </div>\n369\t      </ScrollReveal>\n370\t\n371\t      <ScrollReveal>\n372\t        {config.problem.transition && (\n373\t          <p className=\"mx-auto mt-10 max-w-3xl border-t border-foreground/10 pt-6 text-center font-body text-sm leading-relaxed text-foreground/58 lg:mt-14 lg:text-base\">\n374\t            {config.problem.transition}\n375\t          </p>\n376\t        )}\n377\t      </ScrollReveal>\n378\t    </div>\n379\t  </section>\n380\t);\n381\t\n382\tconst SolutionSection = ({ config }: { config: SectorPageConfig }) => (\n383\t  <section className=\"relative overflow-hidden bg-[#142333] py-20 text-white lg:py-32\">\n384\t    <div\n385\t      aria-hidden=\"true\"\n386\t      className=\"absolute inset-0 opacity-[0.55]\"\n387\t      style={{ backgroundImage: 'linear-gradient(115deg, rgba(255,255,255,0.055) 0 1px, transparent 1px 120px)' }}\n388\t    />\n389\t    <div className=\"container relative mx-auto px-4 lg:px-8\">\n390\t      <ScrollReveal>\n391\t        <div className=\"mx-auto mb-12 grid max-w-6xl grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[0.88fr_1.12fr] lg:gap-16\">\n392\t          <div>\n393\t            <div className=\"mb-6 inline-flex items-center gap-3\">\n394\t              <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n395\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n396\t                {config.solution.eyebrow}\n397\t              </span>\n398\t            </div>\n399\t            <h2\n400\t              className=\"font-satoshi font-bold !leading-[1.04] text-white\"\n401\t              style={{ fontSize: 'clamp(2rem, 3.4vw, 3rem)', letterSpacing: '-0.03em' }}\n402\t            >\n403\t              {config.solution.title}\n404\t              <br />\n405\t              <span className=\"text-white/45\">{config.solution.mutedTitle}</span>\n406\t            </h2>\n407\t          </div>\n408\t          <p className=\"max-w-2xl font-body text-base leading-relaxed text-white/74 lg:text-[17px]\">\n409\t            {config.solution.intro}\n410\t          </p>\n411\t        </div>\n412\t      </ScrollReveal>\n413\t\n414\t      <div className=\"grid grid-cols-1 gap-5 md:grid-cols-2 lg:gap-6\">\n415\t        {[\n416\t          {\n417\t            title: 'Conventional roof',\n418\t            image: config.solution.beforeImage ?? classicRoofImage,\n419\t            metric: 'up to 80°C',\n420\t            metricLabel: 'at the surface',\n421\t            points: ['Dark surface', 'Absorbs heat', 'Strains air conditioning'],\n422\t            cool: false,\n423\t          },\n424\t          {\n425\t            title: 'Cool roof',\n426\t            image: config.solution.afterImage ?? coolRoofImage,\n427\t            metric: 'up to 90%',\n428\t            metricLabel: 'of radiation reflected',\n429\t            points: ['Light-colored surface', 'Stays cooler', 'Reduces the thermal load'],\n430\t            cool: true,\n431\t          },\n432\t        ].map((item) => (\n433\t          <article key={item.title} className=\"overflow-hidden rounded-2xl border border-white/10 bg-white/[0.045]\">\n434\t            <div className=\"relative aspect-[1.1] overflow-hidden bg-[#0f1d2a] md:aspect-[1.18]\">\n435\t              <img src={item.image} alt={item.title} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n436\t              <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-2/3 bg-gradient-to-t from-[#142333] via-[#142333]/20 to-transparent\" />\n437\t            </div>\n438\t            <div className=\"p-5 lg:p-7\">\n439\t              <div className=\"mb-6 flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\">\n440\t                <h3 className=\"font-satoshi text-xl font-bold !leading-tight text-white lg:text-2xl\">\n441\t                  {item.title}\n442\t                </h3>\n443\t                <div className={`shrink-0 rounded-xl border px-4 py-3 ${item.cool ? 'border-teal-vivid/18 bg-teal-vivid/10 text-teal-vivid' : 'border-terracotta/18 bg-terracotta/12 text-[#f0a084]'}`}>\n444\t                  <span className=\"block font-satoshi text-2xl font-bold leading-none lg:text-3xl\">{item.metric}</span>\n445\t                  <span className=\"mt-1 block font-body text-[10px] font-bold uppercase tracking-[0.14em] opacity-75\">\n446\t                    {item.metricLabel}\n447\t                  </span>\n448\t                </div>\n449\t              </div>\n450\t              <ul className=\"grid gap-2.5\">\n451\t                {item.points.map((point) => (\n452\t                  <li key={point} className=\"flex items-start gap-2.5\">\n453\t                    <CheckCircle2 className={`mt-0.5 h-4 w-4 shrink-0 ${item.cool ? 'text-teal-vivid' : 'text-[#f0a084]'}`} strokeWidth={2} />\n454\t                    <span className=\"font-body text-sm leading-relaxed text-white/66\">{point}</span>\n455\t                  </li>\n456\t                ))}\n457\t              </ul>\n458\t            </div>\n459\t          </article>\n460\t        ))}\n461\t      </div>\n462\t\n463\t      {(config.solution.points.length > 0 || config.solution.transition) && (\n464\t        <ScrollReveal>\n465\t          <div className=\"mx-auto mt-10 max-w-6xl lg:mt-14\">\n466\t            {config.solution.points.length > 0 && (\n467\t              <ul className=\"grid grid-cols-1 gap-3 md:grid-cols-4\">\n468\t                {config.solution.points.map((point) => (\n469\t                  <li key={point} className=\"flex items-center gap-3 rounded-xl border border-white/10 bg-white/[0.055] px-5 py-4\">\n470\t                    <span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-teal-vivid/12\">\n471\t                      <Check className=\"h-4 w-4 text-teal-vivid\" strokeWidth={1.8} />\n472\t                    </span>\n473\t                    <span className=\"font-body text-sm font-semibold leading-snug text-white/78\">{point}</span>\n474\t                  </li>\n475\t                ))}\n476\t              </ul>\n477\t            )}\n478\t            {config.solution.transition && (\n479\t              <p className=\"mx-auto mt-8 max-w-2xl text-center font-body text-sm leading-relaxed text-white/52\">\n480\t                {config.solution.transition}\n481\t              </p>\n482\t            )}\n483\t          </div>\n484\t        </ScrollReveal>\n485\t      )}\n486\t    </div>\n487\t  </section>\n488\t);\n489\t\n490\tconst DurabilitySection = ({ config }: { config: SectorPageConfig }) => (\n491\t  <section className=\"relative overflow-hidden bg-[#F6FAFB] py-16 lg:py-28\">\n492\t    <div className=\"container mx-auto px-4 lg:px-8\">\n493\t      <ScrollReveal>\n494\t        <div className=\"mx-auto mb-12 max-w-2xl text-center lg:mb-16\">\n495\t          <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n496\t            Durability\n497\t          </p>\n498\t          <h2\n499\t            className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\"\n500\t            style={{ fontSize: 'clamp(2rem, 3.2vw, 2.85rem)', letterSpacing: '-0.03em' }}\n501\t          >\n502\t            {config.durability.title}\n503\t            {config.durability.mutedTitle && (\n504\t              <>\n505\t                <br />\n506\t                <span className=\"text-foreground/35\">{config.durability.mutedTitle}</span>\n507\t              </>\n508\t            )}\n509\t          </h2>\n510\t          <p className=\"font-body text-base leading-relaxed text-foreground/62 lg:text-[17px]\">\n511\t            {config.durability.intro}\n512\t          </p>\n513\t        </div>\n514\t      </ScrollReveal>\n515\t\n516\t      <ScrollReveal>\n517\t        <div className=\"mx-auto grid max-w-5xl grid-cols-1 items-stretch gap-5 lg:grid-cols-2 lg:gap-0\">\n518\t          {[\n519\t            {\n520\t              title: 'Standard acrylic coating',\n521\t              subtitle: 'Low cost to apply',\n522\t              price: '~€10',\n523\t              life: '2-5 years',\n524\t              realCost: '€25-30',\n525\t              covalba: false,\n526\t              points: ['Reflectivity drops quickly', 'Chalking and yellowing', 'More frequent reapplication'],\n527\t            },\n528\t            {\n529\t              title: 'Covalba polyurethane system',\n530\t              subtitle: config.durability.covalbaLabel,\n531\t              price: '€18-20',\n532\t              life: '8-10 years',\n533\t              realCost: '€18-20',\n534\t              covalba: true,\n535\t              points: ['Durable polyurethane resin', 'Anti-UV finishing varnish', 'Reflectivity retained longer'],\n536\t            },\n537\t          ].map((option) => (\n538\t            <article\n539\t              key={option.title}\n540\t              className={`relative rounded-2xl px-7 py-9 shadow-[0_20px_60px_rgba(26,42,58,0.08)] lg:px-10 lg:py-12 ${\n541\t                option.covalba ? 'z-10 bg-foreground text-white lg:-ml-5 lg:scale-[1.03]' : 'bg-white text-foreground lg:scale-[0.97] lg:opacity-90'\n542\t              }`}\n543\t            >\n544\t              {option.covalba && (\n545\t                <span className=\"absolute -top-4 left-1/2 inline-flex -translate-x-1/2 items-center rounded-full bg-teal-vivid px-4 py-2 font-body text-[11px] font-bold uppercase tracking-[0.15em] text-white\">\n546\t                  The durable choice\n547\t                </span>\n548\t              )}\n549\t              <h3 className=\"mb-2 font-satoshi text-2xl font-bold leading-tight lg:text-[1.7rem]\">{option.title}</h3>\n550\t              <p className={`mb-8 font-body text-sm ${option.covalba ? 'text-white/52' : 'text-foreground/50'}`}>\n551\t                {option.subtitle}\n552\t              </p>\n553\t              <div className=\"mb-8 grid grid-cols-3 gap-4\">\n554\t                {[\n555\t                  ['Price per m²', option.price],\n556\t                  ['Service life', option.life],\n557\t                  ['Over 10 years', option.realCost],\n558\t                ].map(([label, value]) => (\n559\t                  <div key={label}>\n560\t                    <p className={`mb-1 font-body text-[10px] uppercase tracking-widest ${option.covalba ? 'text-white/42' : 'text-foreground/38'}`}>\n561\t                      {label}\n562\t                    </p>\n563\t                    <p className={`font-satoshi text-2xl font-bold leading-none lg:text-3xl ${label === 'Over 10 years' ? (option.covalba ? 'text-teal-vivid' : 'text-terracotta') : ''}`}>\n564\t                      {value}\n565\t                    </p>\n566\t                  </div>\n567\t                ))}\n568\t              </div>\n569\t              <ul className=\"space-y-3 border-t border-current/10 pt-7\">\n570\t                {option.points.map((point) => {\n571\t                  const Icon = option.covalba ? Check : X;\n572\t                  return (\n573\t                    <li key={point} className=\"flex items-start gap-2.5\">\n574\t                      <Icon className={`mt-0.5 h-4 w-4 shrink-0 ${option.covalba ? 'text-teal-vivid' : 'text-terracotta/70'}`} />\n575\t                      <span className={`font-body text-sm leading-relaxed ${option.covalba ? 'text-white/70' : 'text-foreground/60'}`}>\n576\t                        {point}\n577\t                      </span>\n578\t                    </li>\n579\t                  );\n580\t                })}\n581\t              </ul>\n582\t            </article>\n583\t          ))}\n584\t        </div>\n585\t      </ScrollReveal>\n586\t\n587\t      <ScrollReveal>\n588\t        <p className=\"mx-auto mt-10 max-w-3xl text-center font-body text-sm leading-relaxed text-foreground/55 lg:text-[15px]\">\n589\t          {config.durability.note}\n590\t        </p>\n591\t      </ScrollReveal>\n592\t    </div>\n593\t  </section>\n594\t);\n595\t\n596\tconst SpecialSection = ({ config }: { config: SectorPageConfig }) => {\n597\t  const [submitted, setSubmitted] = useState(false);\n598\t  const isFunding = config.special.kind === 'funding';\n599\t\n600\t  return (\n601\t    <section className=\"relative overflow-hidden bg-white py-16 lg:py-28\">\n602\t      <div className=\"container mx-auto px-4 lg:px-8\">\n603\t        <ScrollReveal>\n604\t          <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 items-end gap-7 lg:mb-14 lg:grid-cols-[0.9fr_1.1fr] lg:gap-16\">\n605\t            <div>\n606\t              <div className=\"mb-5 flex items-center gap-3\">\n607\t                <span className=\"h-px w-10 bg-teal-vivid\" aria-hidden=\"true\" />\n608\t                <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n609\t                  {config.special.eyebrow}\n610\t                </span>\n611\t              </div>\n612\t              <h2\n613\t                className=\"font-satoshi font-bold !leading-[1.04] text-foreground\"\n614\t                style={{ fontSize: 'clamp(1.95rem, 3vw, 2.75rem)', letterSpacing: '-0.03em' }}\n615\t              >\n616\t                {config.special.title}\n617\t              </h2>\n618\t            </div>\n619\t            <p className=\"max-w-2xl font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n620\t              {config.special.intro}\n621\t            </p>\n622\t          </div>\n623\t        </ScrollReveal>\n624\t\n625\t        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-5 lg:grid-cols-[0.82fr_1.18fr] lg:gap-7\">\n626\t          <ScrollReveal>\n627\t            <div className=\"h-full rounded-2xl bg-cream/70 p-6 ring-1 ring-foreground/[0.06] lg:p-7\">\n628\t              {!submitted ? (\n629\t                <>\n630\t                  <h3 className=\"mb-5 font-satoshi text-xl font-bold leading-tight text-foreground\">\n631\t                    {isFunding ? 'Check my eligibility' : 'Estimate my savings'}\n632\t                  </h3>\n633\t                  <form\n634\t                    className=\"grid gap-3\"\n635\t                    onSubmit={(event) => {\n636\t                      event.preventDefault();\n637\t                      setSubmitted(true);\n638\t                    }}\n639\t                  >\n640\t                    <select required className={lightFieldClass} defaultValue=\"\">\n641\t                      <option value=\"\" disabled>\n642\t                        Building type\n643\t                      </option>\n644\t                      {config.hero.formFields.typeOptions.map((option) => (\n645\t                        <option key={option}>{option}</option>\n646\t                      ))}\n647\t                    </select>\n648\t                    <input required min=\"1\" type=\"number\" className={lightFieldClass} placeholder=\"Roof surface (m²)\" />\n649\t                    <input required type=\"email\" className={lightFieldClass} placeholder=\"Business email\" />\n650\t                    <button className=\"group mt-1 inline-flex items-center justify-center gap-2 rounded-full bg-teal-vivid py-2.5 pl-6 pr-2 font-semibold text-white\">\n651\t                      <span className=\"text-sm\">{config.special.cta}</span>\n652\t                      <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n653\t                        <ArrowRight className=\"h-3.5 w-3.5\" />\n654\t                      </span>\n655\t                    </button>\n656\t                  </form>\n657\t                </>\n658\t              ) : (\n659\t                <div className=\"flex min-h-[260px] flex-col items-center justify-center text-center\">\n660\t                  <CheckCircle2 className=\"mb-4 h-12 w-12 text-teal-vivid\" strokeWidth={1.7} />\n661\t                  <h3 className=\"mb-3 font-satoshi text-2xl font-bold text-foreground\">Request received.</h3>\n662\t                  <p className=\"max-w-sm font-body text-sm leading-relaxed text-foreground/62\">\n663\t                    Covalba will get back to you with a personalized response.\n664\t                  </p>\n665\t                </div>\n666\t              )}\n667\t            </div>\n668\t          </ScrollReveal>\n669\t\n670\t          <ScrollReveal>\n671\t            <div className=\"rounded-2xl bg-foreground p-6 text-white lg:p-8\">\n672\t              {config.special.kind === 'decret' ? (\n673\t                <div className=\"grid gap-4 sm:grid-cols-3\">\n674\t                  {config.special.milestones.map((milestone) => (\n675\t                    <div key={milestone.value} className=\"rounded-xl border border-white/10 bg-white/[0.04] p-5\">\n676\t                      <p className=\"font-satoshi text-4xl font-bold leading-none text-teal-vivid\">{milestone.value}</p>\n677\t                      <p className=\"mt-3 font-body text-sm text-white/62\">{milestone.label}</p>\n678\t                    </div>\n679\t                  ))}\n680\t                </div>\n681\t              ) : (\n682\t                <div className=\"grid gap-4 sm:grid-cols-2\">\n683\t                  {config.special.points.map((point) => (\n684\t                    <div key={point.label} className=\"rounded-xl border border-white/10 bg-white/[0.04] p-5\">\n685\t                      <p className=\"font-satoshi text-3xl font-bold leading-none text-teal-vivid\">{point.value}</p>\n686\t                      <p className=\"mt-3 font-body text-sm text-white/62\">{point.label}</p>\n687\t                    </div>\n688\t                  ))}\n689\t                </div>\n690\t              )}\n691\t              {config.special.kind === 'decret' && (\n692\t                <div className=\"mt-6 grid gap-3\">\n693\t                  {config.special.points.map((point) => (\n694\t                    <div key={point} className=\"flex items-start gap-3\">\n695\t                      <CheckCircle2 className=\"mt-0.5 h-4 w-4 shrink-0 text-teal-vivid\" />\n696\t                      <span className=\"font-body text-sm leading-relaxed text-white/68\">{point}</span>\n697\t                    </div>\n698\t                  ))}\n699\t                </div>\n700\t              )}\n701\t            </div>\n702\t            <p className=\"mt-5 rounded-2xl bg-cream/70 p-5 font-body text-xs leading-relaxed text-foreground/58 lg:text-[13px]\">\n703\t              {config.special.note}\n704\t            </p>\n705\t          </ScrollReveal>\n706\t        </div>\n707\t      </div>\n708\t    </section>\n709\t  );\n710\t};\n711\t\n712\tconst BenefitsSection = ({ config }: { config: SectorPageConfig }) => (\n713\t  <>\n714\t    <section className=\"relative overflow-hidden bg-cream pb-12 pt-16 lg:min-h-[640px] lg:pb-8 lg:pt-20\">\n715\t      <figure className=\"absolute right-0 top-0 hidden h-full min-h-[640px] w-[58vw] overflow-hidden lg:block\">\n716\t        <img src={config.benefits.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n717\t        <div aria-hidden=\"true\" className=\"absolute inset-y-0 left-0 w-[56%] bg-gradient-to-r from-cream via-cream/88 to-transparent\" />\n718\t      </figure>\n719\t      <div className=\"container relative z-10 mx-auto px-4 lg:px-8\">\n720\t        <ScrollReveal>\n721\t          <div className=\"max-w-[760px]\">\n722\t            <div className=\"mb-5 flex items-center gap-3 lg:mb-7\">\n723\t              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n724\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n725\t                {config.benefits.eyebrow}\n726\t              </span>\n727\t            </div>\n728\t            <h2\n729\t              className=\"mb-6 font-satoshi font-bold !leading-[1.04] text-foreground\"\n730\t              style={{ fontSize: 'clamp(2.15rem, 3vw, 3rem)' }}\n731\t            >\n732\t              {config.benefits.title}\n733\t            </h2>\n734\t            <p className=\"max-w-[540px] font-body text-base leading-relaxed text-foreground/72 lg:text-[16px]\">\n735\t              {config.benefits.desc}\n736\t            </p>\n737\t            <div className=\"relative z-10 mt-7 max-w-[540px] rounded-2xl bg-white/96 p-6 shadow-[0_22px_70px_-45px_hsl(var(--navy)/0.35)] ring-1 ring-foreground/[0.05]\">\n738\t              <div className=\"grid grid-cols-[48px_minmax(0,1fr)] items-center gap-5\">\n739\t                <Thermometer className=\"h-12 w-12 text-primary\" strokeWidth={1.55} />\n740\t                <div>\n741\t                  <p className=\"mb-3 font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n742\t                    From the first summer\n743\t                  </p>\n744\t                  <p className=\"font-satoshi text-[3.1rem] font-bold leading-[0.88] text-primary\">{config.benefits.metric}</p>\n745\t                  <p className=\"mt-2 font-satoshi text-xl font-bold leading-tight text-foreground\">{config.benefits.metricLabel}</p>\n746\t                </div>\n747\t              </div>\n748\t            </div>\n749\t          </div>\n750\t        </ScrollReveal>\n751\t      </div>\n752\t    </section>\n753\t\n754\t    <section className=\"relative overflow-hidden bg-white py-14\">\n755\t      <div className=\"container relative mx-auto px-4 lg:px-8\">\n756\t        <ScrollReveal stagger>\n757\t          <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5 lg:gap-4\">\n758\t            {config.benefits.cards.map((benefit, index) => {\n759\t              const Icon = benefit.icon;\n760\t              return (\n761\t                <article key={benefit.title} className=\"min-h-[184px] rounded-2xl bg-cream/65 p-5 ring-1 ring-foreground/[0.05] lg:p-6\">\n762\t                  <div className=\"mb-7 flex h-11 w-11 items-center justify-center rounded-xl bg-white text-primary\">\n763\t                    <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n764\t                  </div>\n765\t                  <span className=\"mb-3 block font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary/70\">\n766\t                    0{index + 1}\n767\t                  </span>\n768\t                  <h3 className=\"font-satoshi text-lg font-bold leading-tight text-foreground lg:text-[19px]\">{benefit.title}</h3>\n769\t                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/62\">{benefit.desc}</p>\n770\t                </article>\n771\t              );\n772\t            })}\n773\t          </div>\n774\t        </ScrollReveal>\n775\t        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n776\t          {config.benefits.transition}\n777\t        </p>\n778\t      </div>\n779\t    </section>\n780\t  </>\n781\t);\n782\t\n783\tconst ApplicationsSection = ({ config }: { config: SectorPageConfig }) => (\n784\t  <section className=\"relative overflow-hidden bg-cream py-16 lg:py-24\">\n785\t    <div className=\"container relative mx-auto px-4 lg:px-8\">\n786\t      <ScrollReveal>\n787\t        <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 gap-6 lg:mb-12 lg:grid-cols-[0.9fr_1.1fr] lg:items-end lg:gap-16\">\n788\t          <div>\n789\t            <div className=\"mb-5 flex items-center gap-3\">\n790\t              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n791\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n792\t                {config.applications.eyebrow}\n793\t              </span>\n794\t            </div>\n795\t            <h2\n796\t              className=\"font-satoshi font-bold !leading-[1.05] text-foreground\"\n797\t              style={{ fontSize: 'clamp(2rem, 3vw, 3rem)' }}\n798\t            >\n799\t              {config.applications.title}\n800\t            </h2>\n801\t          </div>\n802\t          <p className=\"max-w-[540px] border-l border-primary/30 pl-6 font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n803\t            {config.applications.intro}\n804\t          </p>\n805\t        </div>\n806\t      </ScrollReveal>\n807\t      <ScrollReveal stagger>\n808\t        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-4 lg:grid-cols-5 lg:gap-5\">\n809\t          {config.applications.cards.map((card, index) => {\n810\t            const Icon = card.icon;\n811\t            return (\n812\t              <article key={card.title} className=\"overflow-hidden rounded-2xl bg-white shadow-[0_16px_46px_-38px_hsl(var(--navy)/0.34)] ring-1 ring-foreground/[0.06]\">\n813\t                <div className=\"aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n814\t                  <img src={card.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n815\t                </div>\n816\t                <div className=\"p-5\">\n817\t                  <div className=\"mb-4 flex items-center justify-between gap-3\">\n818\t                    <span className=\"inline-flex items-center gap-2 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary\">\n819\t                      <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n820\t                      {card.label}\n821\t                    </span>\n822\t                    <span className=\"font-body text-xs font-bold text-foreground/22\">0{index + 1}</span>\n823\t                  </div>\n824\t                  <h3 className=\"font-satoshi text-xl font-bold leading-tight text-foreground\">{card.title}</h3>\n825\t                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/60\">{card.desc}</p>\n826\t                </div>\n827\t              </article>\n828\t            );\n829\t          })}\n830\t        </div>\n831\t      </ScrollReveal>\n832\t      {config.applications.transition && (\n833\t        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n834\t          {config.applications.transition}\n835\t        </p>\n836\t      )}\n837\t    </div>\n838\t  </section>\n839\t);\n840\t\n841\tconst MethodSection = ({ config }: { config: SectorPageConfig }) => {\n842\t  const [videoOpen, setVideoOpen] = useState(false);\n843\t  const icons = [ClipboardCheck, CalendarClock, Shield, TrendingDown];\n844\t  return (\n845\t    <section className=\"bg-white py-16 lg:py-32\">\n846\t      <div className=\"container mx-auto px-4 lg:px-8\">\n847\t        <div className=\"flex flex-col items-start gap-12 lg:flex-row lg:gap-20\">\n848\t          <div className=\"lg:sticky lg:top-[120px] lg:w-[40%]\">\n849\t            <ScrollReveal>\n850\t              <p className=\"mb-6 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/50\">\n851\t                {config.method.eyebrow}\n852\t              </p>\n853\t              <h2\n854\t                className=\"mb-6 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] sm:text-4xl lg:text-[3rem]\"\n855\t                style={{ letterSpacing: '-0.03em' }}\n856\t              >\n857\t                {config.method.title}\n858\t                <span className=\"text-foreground/30\"> {config.method.mutedTitle}</span>\n859\t              </h2>\n860\t              <p className=\"mb-8 font-body text-base leading-relaxed text-muted-foreground lg:text-lg\">\n861\t                {config.method.intro}\n862\t              </p>\n863\t              <button onClick={() => setVideoOpen(true)} className=\"group flex items-center gap-3 text-primary\">\n864\t                <div className=\"flex h-12 w-12 items-center justify-center rounded-full bg-primary/10\">\n865\t                  <Play className=\"h-5 w-5\" />\n866\t                </div>\n867\t                <span className=\"font-body text-sm font-semibold\">Watch a project in 2 minutes</span>\n868\t              </button>\n869\t            </ScrollReveal>\n870\t          </div>\n871\t          <div className=\"relative lg:w-[60%]\">\n872\t            <div className=\"absolute bottom-4 left-5 top-4 w-px bg-gradient-to-b from-primary/25 via-primary/10 to-transparent lg:left-6\" />\n873\t            {config.method.steps.map((step, index) => {\n874\t              const Icon = icons[index] ?? ClipboardCheck;\n875\t              return (\n876\t                <ScrollReveal key={step.title}>\n877\t                  <div className=\"group relative flex items-start gap-5 py-8 lg:gap-7 lg:py-10\">\n878\t                    <div className=\"relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full border border-primary/20 bg-primary/10 lg:h-12 lg:w-12\">\n879\t                      <Icon className=\"h-4 w-4 text-primary lg:h-5 lg:w-5\" />\n880\t                    </div>\n881\t                    <div className=\"pt-1\">\n882\t                      <span className=\"mb-2 block font-body text-xs font-bold uppercase tracking-widest text-primary/50\">\n883\t                        Step 0{index + 1}\n884\t                      </span>\n885\t                      <h3 className=\"mb-2 text-xl text-foreground lg:text-2xl\">{step.title}</h3>\n886\t                      <p className=\"max-w-md font-body text-sm leading-relaxed text-muted-foreground lg:text-base\">{step.text}</p>\n887\t                    </div>\n888\t                  </div>\n889\t                  {index < config.method.steps.length - 1 && <div className=\"ml-5 h-px bg-border lg:ml-6\" />}\n890\t                </ScrollReveal>\n891\t              );\n892\t            })}\n893\t            <p className=\"ml-16 mt-4 font-body text-xs font-medium text-muted-foreground/50 lg:ml-20\">\n894\t              {config.method.duration}\n895\t            </p>\n896\t          </div>\n897\t        </div>\n898\t      </div>\n899\t      <Dialog open={videoOpen} onOpenChange={setVideoOpen}>\n900\t        <DialogContent className=\"max-w-4xl overflow-hidden border-none bg-black p-0\">\n901\t          <div className=\"aspect-video\">\n902\t            <iframe\n903\t              src=\"https://www.youtube.com/embed/9HOB5OVH0Ac?autoplay=1\"\n904\t              className=\"h-full w-full\"\n905\t              allow=\"autoplay; encrypted-media\"\n906\t              allowFullScreen\n907\t              title=\"Covalba Cool Roof, a project in 2 minutes\"\n908\t            />\n909\t          </div>\n910\t        </DialogContent>\n911\t      </Dialog>\n912\t    </section>\n913\t  );\n914\t};\n915\t\n916\tconst ProofSection = ({ config }: { config: SectorPageConfig }) => (\n917\t  <section className=\"relative overflow-hidden bg-[#192A3A] py-24 lg:py-36\">\n918\t    <div className=\"container relative mx-auto px-4 lg:px-8\">\n919\t      <ScrollReveal>\n920\t        <div className=\"mb-9 flex items-center gap-3 lg:mb-12\">\n921\t          <span className=\"h-px w-12 bg-teal-vivid/70\" aria-hidden=\"true\" />\n922\t          <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n923\t            {config.proof.eyebrow}\n924\t          </span>\n925\t        </div>\n926\t        <div className=\"mb-14 grid grid-cols-1 items-start gap-8 lg:mb-20 lg:grid-cols-[3fr_2fr] lg:gap-16\">\n927\t          <h2\n928\t            className=\"font-satoshi font-bold text-white !leading-[1.05]\"\n929\t            style={{ fontSize: 'clamp(1.875rem, 3.8vw, 3rem)', letterSpacing: '-0.03em' }}\n930\t          >\n931\t            {config.proof.title}\n932\t            <br />\n933\t            <span className=\"text-teal-vivid\">{config.proof.mutedTitle}</span>\n934\t          </h2>\n935\t          <p className=\"max-w-[470px] font-body text-base leading-relaxed text-white/65 lg:mt-2 lg:text-[16px]\">\n936\t            {config.proof.intro}\n937\t          </p>\n938\t        </div>\n939\t      </ScrollReveal>\n940\t      <ScrollReveal stagger>\n941\t        <div className=\"mb-12 grid grid-cols-1 gap-4 md:grid-cols-3 lg:gap-5\">\n942\t          {config.proof.figures.map((figure) => {\n943\t            const Icon = figure.icon;\n944\t            return (\n945\t              <div key={figure.label} className=\"rounded-2xl border border-white/10 bg-white/[0.04] p-8 lg:p-9\">\n946\t                <div className=\"mb-6 flex h-11 w-11 items-center justify-center rounded-full bg-teal-vivid/[0.12]\">\n947\t                  <Icon className=\"h-5 w-5 text-teal-vivid\" strokeWidth={1.6} />\n948\t                </div>\n949\t                <p className=\"mb-3 font-satoshi text-4xl font-bold leading-none text-white\">{figure.value}</p>\n950\t                <p className=\"font-body text-sm leading-relaxed text-white/60\">{figure.label}</p>\n951\t              </div>\n952\t            );\n953\t          })}\n954\t        </div>\n955\t      </ScrollReveal>\n956\t      {config.proof.cases && (\n957\t        <div className=\"mb-12 grid gap-4 md:grid-cols-2\">\n958\t          {config.proof.cases.map((item) => (\n959\t            <div key={item.name} className=\"rounded-2xl border border-white/10 bg-white/[0.04] p-6\">\n960\t              <h3 className=\"mb-2 font-satoshi text-xl font-bold text-white\">{item.name}</h3>\n961\t              <p className=\"font-body text-sm leading-relaxed text-white/60\">{item.desc}</p>\n962\t            </div>\n963\t          ))}\n964\t        </div>\n965\t      )}\n966\t      <div className=\"border-t border-white/10 pt-10\">\n967\t        <div className=\"flex flex-wrap items-center justify-center gap-x-10 gap-y-7 lg:gap-x-14\">\n968\t          {config.proof.logos.map((logo) =>\n969\t            logo.url ? (\n970\t              <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center\">\n971\t                <img\n972\t                  src={logo.url}\n973\t                  alt={logo.name}\n974\t                  className=\"max-h-7 max-w-full object-contain opacity-45\"\n975\t                  style={{ filter: 'brightness(0) invert(1)' }}\n976\t                  loading=\"lazy\"\n977\t                  decoding=\"async\"\n978\t                />\n979\t              </span>\n980\t            ) : (\n981\t              <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center font-satoshi text-lg font-bold text-white/50\">{logo.name}</span>\n982\t            )\n983\t          )}\n984\t        </div>\n985\t        <p className=\"mx-auto mt-9 max-w-2xl text-center font-body text-sm leading-relaxed text-white/70\">\n986\t          {config.proof.transition}\n987\t        </p>\n988\t      </div>\n989\t    </div>\n990\t  </section>\n991\t);\n992\t\n993\tconst FaqSection = ({ config }: { config: SectorPageConfig }) => (\n994\t  <section className=\"bg-cream py-20 lg:py-32\">\n995\t    <div className=\"container mx-auto px-4 lg:px-8\">\n996\t      <ScrollReveal>\n997\t        <div className=\"grid items-start gap-10 lg:grid-cols-[0.85fr_1.15fr] lg:gap-16\">\n998\t          <div className=\"lg:sticky lg:top-24\">\n999\t            <div className=\"mb-5 flex items-center gap-3\">\n1000\t              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n1001\t              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">FAQ</span>\n1002\t            </div>\n1003\t            <h2 className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\" style={{ fontSize: 'clamp(2rem, 3.3vw, 3rem)', letterSpacing: '-0.03em' }}>\n1004\t              Your questions,\n1005\t              <br />\n1006\t              <span className=\"text-foreground/40\">our answers.</span>\n1007\t            </h2>\n1008\t            <p className=\"max-w-[420px] font-body text-base leading-relaxed text-foreground/65 lg:text-[15.5px]\">\n1009\t              {config.faq.intro}\n1010\t            </p>\n1011\t            <a href={`#contact-${config.slug}`} className=\"group mt-8 inline-flex items-center gap-2 text-sm font-semibold text-primary\">\n1012\t              Another question? Let's talk\n1013\t              <ArrowRight className=\"h-4 w-4\" />\n1014\t            </a>\n1015\t          </div>\n1016\t          <Accordion type=\"single\" collapsible className=\"space-y-3\">\n1017\t            {config.faq.items.map((faq, index) => (\n1018\t              <AccordionItem key={faq.q} value={`${config.slug}-faq-${index}`} className=\"rounded-xl border border-foreground/[0.06] bg-white px-5 shadow-[0_12px_34px_rgba(24,42,58,0.04)] lg:px-6\">\n1019\t                <AccordionTrigger className=\"py-5 text-left font-satoshi text-base font-bold text-foreground hover:no-underline lg:text-[17px]\">\n1020\t                  {faq.q}\n1021\t                </AccordionTrigger>\n1022\t                <AccordionContent className=\"pb-5 font-body text-[14.5px] leading-relaxed text-foreground/67 lg:text-[15px]\">\n1023\t                  {faq.a}\n1024\t                </AccordionContent>\n1025\t              </AccordionItem>\n1026\t            ))}\n1027\t          </Accordion>\n1028\t        </div>\n1029\t      </ScrollReveal>\n1030\t    </div>\n1031\t  </section>\n1032\t);\n1033\t\n1034\tconst FinalCta = ({ config }: { config: SectorPageConfig }) => (\n1035\t  <section id={`contact-${config.slug}`} className=\"overflow-hidden bg-[#182A3A] py-20 lg:py-32\">\n1036\t    <div className=\"container mx-auto px-4 lg:px-8\">\n1037\t      <ScrollReveal>\n1038\t        <div className=\"mx-auto max-w-4xl text-center\">\n1039\t          <div className=\"mb-6 inline-flex items-center gap-3\">\n1040\t            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n1041\t            <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n1042\t              {config.finalCta.eyebrow}\n1043\t            </span>\n1044\t            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n1045\t          </div>\n1046\t          <h2 className=\"mb-6 font-satoshi font-bold text-white !leading-[1.04]\" style={{ fontSize: 'clamp(2rem, 3.8vw, 3.5rem)', letterSpacing: '-0.03em' }}>\n1047\t            {config.finalCta.title}\n1048\t          </h2>\n1049\t          <p className=\"mx-auto mb-9 max-w-2xl font-body text-base leading-relaxed text-white/[0.72] lg:text-[17px]\">\n1050\t            {config.finalCta.desc}\n1051\t          </p>\n1052\t          <div className=\"flex flex-col items-stretch justify-center gap-3 sm:flex-row sm:items-center\">\n1053\t            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full cta-gradient py-2.5 pl-6 pr-2 font-semibold text-white\">\n1054\t              <span className=\"text-sm\">Request a quote</span>\n1055\t              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20\">\n1056\t                <ArrowRight className=\"h-3.5 w-3.5\" />\n1057\t              </span>\n1058\t            </a>\n1059\t            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full border border-white/[0.22] py-2.5 pl-6 pr-2 font-semibold text-white/[0.88]\">\n1060\t              <span className=\"text-sm\">Talk to an expert</span>\n1061\t              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/[0.12]\">\n1062\t                <ArrowRight className=\"h-3.5 w-3.5\" />\n1063\t              </span>\n1064\t            </a>\n1065\t          </div>\n1066\t        </div>\n1067\t      </ScrollReveal>\n1068\t      <ul className=\"mx-auto mt-12 grid max-w-3xl gap-3 sm:grid-cols-3\">\n1069\t        {config.finalCta.reassurances.map((item, index) => {\n1070\t          const icons = [CalendarCheck, BadgeCheck, Shield];\n1071\t          const Icon = icons[index] ?? BadgeCheck;\n1072\t          return (\n1073\t            <li key={item} className=\"flex items-center justify-center gap-2.5 rounded-lg border border-white/[0.12] bg-white/[0.045] px-4 py-3\">\n1074\t              <Icon className=\"h-4 w-4 shrink-0 text-teal-vivid\" strokeWidth={1.8} />\n1075\t              <span className=\"font-body text-sm text-white/[0.76]\">{item}</span>\n1076\t            </li>\n1077\t          );\n1078\t        })}\n1079\t      </ul>\n1080\t    </div>\n1081\t  </section>\n1082\t);\n1083\t\n1084\tconst SeoContent = ({ config }: { config: SectorPageConfig }) => (\n1085\t  <section className=\"bg-cream py-16 lg:py-28\">\n1086\t    <div className=\"container mx-auto px-4 lg:px-8\">\n1087\t      <div className=\"mx-auto max-w-5xl\">\n1088\t        <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n1089\t          {config.seo.eyebrow}\n1090\t        </p>\n1091\t        <h2 className=\"mb-5 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] lg:text-5xl\">\n1092\t          {config.seo.title}\n1093\t        </h2>\n1094\t        <p className=\"mb-12 max-w-3xl font-body text-base leading-relaxed text-foreground/64\">\n1095\t          {config.seo.intro}\n1096\t        </p>\n1097\t        <div className=\"grid gap-10 md:grid-cols-2\">\n1098\t          {config.seo.sections.map((section) => (\n1099\t            <article key={section.title}>\n1100\t              <h3 className=\"mb-3 font-satoshi text-xl font-bold text-foreground\">{section.title}</h3>\n1101\t              <p className=\"font-body text-sm leading-relaxed text-foreground/68\">{section.body}</p>\n1102\t            </article>\n1103\t          ))}\n1104\t        </div>\n1105\t        <div className=\"mt-12 border-t border-foreground/10 pt-8\">\n1106\t          <p className=\"mb-4 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-foreground/38\">Sources</p>\n1107\t          <ul className=\"grid gap-2 font-body text-xs leading-relaxed text-foreground/50 md:grid-cols-2\">\n1108\t            {config.seo.sources.map((source) => (\n1109\t              <li key={source}>{source}</li>\n1110\t            ))}\n1111\t          </ul>\n1112\t        </div>\n1113\t      </div>\n1114\t    </div>\n1115\t  </section>\n1116\t);\n1117\t\n1118\texport const SectorPageTemplateEN = ({ config }: { config: SectorPageConfig }) => (\n1119\t  <>\n1120\t    <Seo config={config} />\n1121\t    <SectorHero config={config} />\n1122\t    <ReassuranceBand items={config.reassurance} />\n1123\t    <ProblemSection config={config} />\n1124\t    <SolutionSection config={config} />\n1125\t    <DurabilitySection config={config} />\n1126\t    <SpecialSection config={config} />\n1127\t    <BenefitsSection config={config} />\n1128\t    <ApplicationsSection config={config} />\n1129\t    <MethodSection config={config} />\n1130\t    <ProofSection config={config} />\n1131\t    <FaqSection config={config} />\n1132\t    <FinalCta config={config} />\n1133\t    <SeoContent config={config} />\n1134\t  </>\n1135\t);\n1136\t\n1137\texport const defaultIconsEN = {\n1138\t  Building2,\n1139\t  HelpCircle,\n1140\t  Shield,\n1141\t  Thermometer,\n1142\t  TrendingDown,\n1143\t  UsersRound,\n1144\t};\n1145\t"}]},"uuid":"b225ac5b-6b97-442e-b737-9b0dfbfbddd1","timestamp":"2026-06-21T23:05:09.290Z","toolUseResult":{"type":"text","file":{"filePath":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/components/en/industries/SectorPageTemplateEN.tsx","content":"import { useState } from 'react';\nimport {\n  ArrowRight,\n  BadgeCheck,\n  Building2,\n  CalendarCheck,\n  CalendarClock,\n  Check,\n  CheckCircle2,\n  ClipboardCheck,\n  HelpCircle,\n  Play,\n  Shield,\n  Thermometer,\n  TrendingDown,\n  UsersRound,\n  X,\n} from 'lucide-react';\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';\nimport { Dialog, DialogContent } from '@/components/ui/dialog';\nimport ScrollReveal from '@/components/ScrollReveal';\nimport { type SectorPageConfig } from '@/components/industries/SectorPageTemplate';\nimport { useJsonLd, usePageMeta } from '@/hooks/usePageMeta';\nimport classicRoofImage from '@/assets/industrie/logistique-solution-classic.webp';\nimport coolRoofImage from '@/assets/industrie/logistique-solution-coolroof.webp';\n\nconst SITE_URL = 'https://www.covalba.fr';\n\nconst inputClass =\n  'w-full rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white placeholder:text-white/40 transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n\nconst selectClass =\n  'w-full appearance-none rounded-xl border border-white/[0.12] bg-white/[0.07] px-4 py-3 font-body text-sm text-white transition-all duration-300 focus:border-white/25 focus:outline-none focus:ring-2 focus:ring-primary/50';\n\nconst lightFieldClass =\n  'w-full rounded-xl border border-foreground/10 bg-white px-4 py-3 font-body text-sm text-foreground outline-none transition-all focus:border-teal-vivid/40 focus:ring-2 focus:ring-teal-vivid/15';\n\nconst Seo = ({ config }: { config: SectorPageConfig }) => {\n  const pageUrl = `${SITE_URL}${config.canonicalPath}`;\n  usePageMeta({ title: config.title, description: config.description, canonical: pageUrl });\n  useJsonLd(`${config.slug}-en-breadcrumb-schema`, {\n    '@context': 'https://schema.org',\n    '@type': 'BreadcrumbList',\n    itemListElement: [\n      { '@type': 'ListItem', position: 1, name: 'Home', item: `${SITE_URL}/en` },\n      { '@type': 'ListItem', position: 2, name: 'Industries', item: `${SITE_URL}/en` },\n      { '@type': 'ListItem', position: 3, name: config.serviceName, item: pageUrl },\n    ],\n  });\n  useJsonLd(`${config.slug}-en-service-schema`, {\n    '@context': 'https://schema.org',\n    '@type': 'Service',\n    name: config.serviceName,\n    serviceType: 'Reflective roof coating',\n    provider: { '@type': 'Organization', name: 'Covalba', url: SITE_URL },\n    areaServed: { '@type': 'Country', name: 'France' },\n    description: config.serviceDescription,\n    audience: { '@type': 'BusinessAudience', audienceType: config.audience },\n  });\n  return null;\n};\n\nconst ReassuranceBand = ({ items }: { items?: string[] }) => {\n  if (!items?.length) return null;\n\n  return (\n    <section className=\"border-y border-foreground/[0.06] bg-white py-4\">\n      <div className=\"container mx-auto px-4 lg:px-8\">\n        <ul className=\"flex flex-col items-start justify-center gap-3 font-body text-sm font-semibold text-foreground/62 sm:flex-row sm:flex-wrap sm:items-center sm:gap-x-6 sm:gap-y-2\">\n          {items.map((item) => (\n            <li key={item} className=\"flex items-center gap-2.5\">\n              <CheckCircle2 className=\"h-4 w-4 shrink-0 text-teal-vivid\" strokeWidth={1.8} />\n              <span>{item}</span>\n            </li>\n          ))}\n        </ul>\n      </div>\n    </section>\n  );\n};\n\nconst SectorHero = ({ config }: { config: SectorPageConfig }) => {\n  const [form, setForm] = useState({ type: '', climate: '', surface: '', year: '', email: '' });\n  const [submitted, setSubmitted] = useState(false);\n  const surfaceNum = parseFloat(form.surface) || 0;\n  const estimMin = surfaceNum * 18;\n  const estimMax = surfaceNum * 25;\n  const fmt = (n: number) => new Intl.NumberFormat('en-US').format(n);\n\n  return (\n    <section\n      aria-labelledby={`${config.slug}-hero-title`}\n      className=\"relative isolate flex min-h-[100svh] flex-col overflow-hidden bg-navy text-cream\"\n    >\n      <img\n        src={config.hero.image}\n        alt={config.hero.imageAlt}\n        className=\"absolute inset-0 -z-10 size-full scale-[1.02] object-cover\"\n        loading=\"eager\"\n        decoding=\"async\"\n      />\n      <div\n        aria-hidden=\"true\"\n        className=\"absolute inset-0 -z-10 hidden bg-gradient-to-r from-navy/[0.92] via-navy/55 to-navy/25 lg:block\"\n      />\n      <div\n        aria-hidden=\"true\"\n        className=\"absolute inset-0 -z-10 bg-gradient-to-b from-navy/80 via-navy/22 to-navy/95 lg:hidden\"\n      />\n      <div\n        aria-hidden=\"true\"\n        className=\"absolute inset-x-0 bottom-0 -z-10 h-[28%] bg-gradient-to-t from-navy via-navy/85 to-transparent\"\n      />\n\n      <div className=\"container relative z-10 mx-auto flex flex-1 items-center px-6 pb-10 pt-24 lg:px-12 lg:pb-16 lg:pt-28\">\n        <div className=\"grid w-full grid-cols-1 items-center gap-10 lg:grid-cols-[55fr_45fr] lg:gap-12\">\n          <div className=\"max-w-2xl space-y-6 lg:space-y-8\">\n            {config.hero.eyebrow && (\n              <div className=\"flex items-center gap-3\">\n                <span className=\"h-px w-9 bg-teal-vivid\" aria-hidden=\"true\" />\n                <span className=\"font-body text-[11px] font-semibold uppercase tracking-[0.22em] text-teal-vivid\">\n                  {config.hero.eyebrow}\n                </span>\n              </div>\n            )}\n\n            <h1\n              id={`${config.slug}-hero-title`}\n              className=\"font-satoshi font-bold leading-[1.02] text-white\"\n              style={{ fontSize: 'clamp(2.25rem, 4.6vw, 4rem)', letterSpacing: '-0.03em' }}\n            >\n              {config.hero.h1}\n            </h1>\n\n            <p\n              className=\"max-w-xl font-satoshi font-medium leading-[1.3] text-cream/65\"\n              style={{ fontSize: 'clamp(1rem, 1.5vw, 1.375rem)', letterSpacing: '-0.005em' }}\n            >\n              {config.hero.sub}\n            </p>\n\n            <ul className=\"hidden gap-4 pt-1 sm:flex sm:flex-wrap lg:gap-6\" aria-label=\"Key benefits\">\n              {config.hero.stats.map((stat, index) => {\n                const Icon = stat.icon;\n                return (\n                  <li\n                    key={stat.label}\n                    className={`flex items-start gap-3 ${\n                      index !== 0 ? 'sm:border-l sm:border-white/10 sm:pl-6' : ''\n                    }`}\n                  >\n                    <Icon className=\"mt-0.5 h-[18px] w-[18px] shrink-0 text-teal-vivid\" strokeWidth={1.5} />\n                    <div className=\"leading-tight\">\n                      <p className=\"font-satoshi text-[15px] font-bold text-white lg:text-base\">{stat.value}</p>\n                      <p className=\"mt-1 font-body text-[12.5px] text-cream/55 lg:text-[13px]\">{stat.label}</p>\n                    </div>\n                  </li>\n                );\n              })}\n            </ul>\n          </div>\n\n          <div className=\"animate-hero-stats\">\n            <div className=\"rounded-[1.5rem] border border-white/[0.08] bg-white/[0.04] p-1.5 backdrop-blur-sm\">\n              <div className=\"rounded-[calc(1.5rem-6px)] border border-white/[0.06] bg-[#0b1a2b]/80 p-4 shadow-[inset_0_1px_1px_rgba(255,255,255,0.06)] backdrop-blur-xl lg:p-7\">\n                {!submitted ? (\n                  <>\n                    <h2 className=\"mb-1 text-center font-satoshi text-xl font-bold text-white lg:text-2xl\">\n                      {config.hero.formTitle}\n                    </h2>\n                    <p className=\"mb-4 text-center font-body text-[12px] text-white/50\">\n                      {config.hero.formSubtitle}\n                    </p>\n                    <form\n                      onSubmit={(event) => {\n                        event.preventDefault();\n                        setSubmitted(true);\n                      }}\n                      className=\"space-y-2.5 lg:space-y-3\"\n                    >\n                      <select\n                        required\n                        value={form.type}\n                        onChange={(e) => setForm({ ...form, type: e.target.value })}\n                        className={selectClass}\n                      >\n                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n                          {config.hero.formFields.typeLabel}\n                        </option>\n                        {config.hero.formFields.typeOptions.map((option) => (\n                          <option key={option} value={option} className=\"bg-card text-foreground\">\n                            {option}\n                          </option>\n                        ))}\n                      </select>\n                      <select\n                        required\n                        value={form.climate}\n                        onChange={(e) => setForm({ ...form, climate: e.target.value })}\n                        className={selectClass}\n                      >\n                        <option value=\"\" disabled className=\"bg-card text-foreground\">\n                          {config.hero.formFields.climateLabel}\n                        </option>\n                        {config.hero.formFields.climateOptions.map((option) => (\n                          <option key={option} value={option} className=\"bg-card text-foreground\">\n                            {option}\n                          </option>\n                        ))}\n                      </select>\n                      <input\n                        type=\"number\"\n                        placeholder=\"Roof surface (m²)\"\n                        required\n                        min=\"1\"\n                        value={form.surface}\n                        onChange={(e) => setForm({ ...form, surface: e.target.value })}\n                        className={inputClass}\n                      />\n                      <input\n                        type=\"number\"\n                        placeholder={config.hero.formFields.yearLabel}\n                        required\n                        min=\"1900\"\n                        value={form.year}\n                        onChange={(e) => setForm({ ...form, year: e.target.value })}\n                        className={inputClass}\n                      />\n                      <input\n                        type=\"email\"\n                        placeholder=\"Business email\"\n                        required\n                        value={form.email}\n                        onChange={(e) => setForm({ ...form, email: e.target.value })}\n                        className={inputClass}\n                      />\n\n                      <button\n                        type=\"submit\"\n                        className=\"group mt-1 flex w-full items-center justify-center gap-3 rounded-full cta-gradient py-3 font-semibold text-white active:scale-[0.98]\"\n                      >\n                        <span className=\"text-[15px]\">{config.hero.formFields.cta}</span>\n                        <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n                          <ArrowRight className=\"h-4 w-4\" />\n                        </span>\n                      </button>\n                    </form>\n\n                    <p className=\"mt-3 text-center font-body text-[11px] text-white/35\">\n                      {config.hero.formFields.microcopy}\n                    </p>\n                  </>\n                ) : (\n                  <div className=\"py-4 text-center\">\n                    <div className=\"mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-primary/20\">\n                      <Shield className=\"h-6 w-6 text-primary\" />\n                    </div>\n                    <p className=\"mb-1 font-body text-sm text-white/60\">Indicative budget for {fmt(surfaceNum)} m²</p>\n                    <p className=\"mb-4 font-satoshi text-2xl font-bold text-white\">\n                      €{fmt(estimMin)} - €{fmt(estimMax)}\n                    </p>\n                    <p className=\"mb-4 font-body text-[13px] text-white/50\">\n                      An advisor will get back to you within 24 hours with a detailed estimate.\n                    </p>\n                    <button\n                      onClick={() => setSubmitted(false)}\n                      className=\"font-body text-sm font-semibold text-primary hover:underline\"\n                    >\n                      Edit my request\n                    </button>\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div className=\"relative z-10 mt-auto hidden lg:block\">\n        <div className=\"border-t border-white/10 bg-navy/78 py-5 backdrop-blur-md\">\n          <p className=\"mb-3 text-center font-body text-[10px] font-semibold uppercase tracking-[0.2em] text-white/35\">\n            {config.logos.title}\n          </p>\n          <div className=\"mx-auto flex max-w-6xl flex-nowrap items-center justify-center gap-x-8 px-8 xl:gap-x-12\">\n            {config.logos.items.map((logo) =>\n              logo.url ? (\n                <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center\">\n                  <img\n                    src={logo.url}\n                    alt={logo.name}\n                    className=\"max-h-7 max-w-full object-contain opacity-45 transition-opacity duration-300 hover:opacity-75\"\n                    style={{ filter: 'brightness(0) invert(1)' }}\n                    loading=\"lazy\"\n                    decoding=\"async\"\n                  />\n                </span>\n              ) : (\n                <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center whitespace-nowrap font-satoshi text-base font-bold text-white/50 xl:text-lg\">\n                  {logo.name}\n                </span>\n              )\n            )}\n          </div>\n        </div>\n      </div>\n    </section>\n  );\n};\n\nconst ProblemSection = ({ config }: { config: SectorPageConfig }) => (\n  <section className=\"relative overflow-hidden bg-cream py-20 lg:py-32\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <div className=\"mb-10 grid grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[1.05fr_0.95fr] lg:gap-20\">\n        <div className=\"space-y-6 lg:space-y-9\">\n          <ScrollReveal>\n            <div className=\"flex items-center gap-3\">\n              <span className=\"h-px w-9 bg-terracotta/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-terracotta-dark\">\n                {config.problem.eyebrow}\n              </span>\n            </div>\n          </ScrollReveal>\n          <ScrollReveal>\n            <h2\n              className=\"font-satoshi font-bold text-foreground !leading-[1.05]\"\n              style={{ fontSize: 'clamp(1.875rem, 3.6vw, 2.875rem)', letterSpacing: '-0.025em' }}\n            >\n              {config.problem.title}\n              <br />\n              <span className=\"text-foreground/40\">{config.problem.mutedTitle}</span>\n            </h2>\n          </ScrollReveal>\n        </div>\n        <ScrollReveal>\n          <p className=\"max-w-[560px] font-body text-base leading-relaxed text-foreground/65 lg:ml-auto lg:text-[16px]\">\n            {config.problem.intro}\n          </p>\n        </ScrollReveal>\n      </div>\n\n      <ScrollReveal stagger>\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 lg:gap-5 xl:gap-6\">\n          {config.problem.cards.map((problem) => {\n            const Icon = problem.icon;\n            return (\n              <article\n                key={problem.title}\n                className=\"group overflow-hidden rounded-2xl bg-white shadow-[0_18px_45px_-34px_hsl(var(--navy)/0.28)] ring-1 ring-foreground/[0.05]\"\n              >\n                <div className=\"relative aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n                  <img src={problem.image} alt={problem.alt} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n                  <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-1/2 bg-gradient-to-t from-navy/45 to-transparent\" />\n                  <span className=\"absolute left-4 top-4 flex h-10 w-10 items-center justify-center rounded-full bg-cream/90 text-terracotta-dark shadow-sm\">\n                    <Icon className=\"h-5 w-5\" strokeWidth={1.7} />\n                  </span>\n                </div>\n                <div className=\"px-6 py-7 lg:px-6 lg:py-8\">\n                  <h3 className=\"mb-3 font-satoshi text-[18px] font-bold !leading-tight text-foreground lg:text-[19px]\">\n                    {problem.title}\n                  </h3>\n                  <p className=\"font-body text-[14px] leading-relaxed text-foreground/62 lg:text-[14.5px]\">\n                    {problem.desc}\n                  </p>\n                </div>\n              </article>\n            );\n          })}\n        </div>\n      </ScrollReveal>\n\n      <ScrollReveal>\n        {config.problem.transition && (\n          <p className=\"mx-auto mt-10 max-w-3xl border-t border-foreground/10 pt-6 text-center font-body text-sm leading-relaxed text-foreground/58 lg:mt-14 lg:text-base\">\n            {config.problem.transition}\n          </p>\n        )}\n      </ScrollReveal>\n    </div>\n  </section>\n);\n\nconst SolutionSection = ({ config }: { config: SectorPageConfig }) => (\n  <section className=\"relative overflow-hidden bg-[#142333] py-20 text-white lg:py-32\">\n    <div\n      aria-hidden=\"true\"\n      className=\"absolute inset-0 opacity-[0.55]\"\n      style={{ backgroundImage: 'linear-gradient(115deg, rgba(255,255,255,0.055) 0 1px, transparent 1px 120px)' }}\n    />\n    <div className=\"container relative mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto mb-12 grid max-w-6xl grid-cols-1 items-end gap-8 lg:mb-16 lg:grid-cols-[0.88fr_1.12fr] lg:gap-16\">\n          <div>\n            <div className=\"mb-6 inline-flex items-center gap-3\">\n              <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n                {config.solution.eyebrow}\n              </span>\n            </div>\n            <h2\n              className=\"font-satoshi font-bold !leading-[1.04] text-white\"\n              style={{ fontSize: 'clamp(2rem, 3.4vw, 3rem)', letterSpacing: '-0.03em' }}\n            >\n              {config.solution.title}\n              <br />\n              <span className=\"text-white/45\">{config.solution.mutedTitle}</span>\n            </h2>\n          </div>\n          <p className=\"max-w-2xl font-body text-base leading-relaxed text-white/74 lg:text-[17px]\">\n            {config.solution.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n\n      <div className=\"grid grid-cols-1 gap-5 md:grid-cols-2 lg:gap-6\">\n        {[\n          {\n            title: 'Conventional roof',\n            image: config.solution.beforeImage ?? classicRoofImage,\n            metric: 'up to 80°C',\n            metricLabel: 'at the surface',\n            points: ['Dark surface', 'Absorbs heat', 'Strains air conditioning'],\n            cool: false,\n          },\n          {\n            title: 'Cool roof',\n            image: config.solution.afterImage ?? coolRoofImage,\n            metric: 'up to 90%',\n            metricLabel: 'of radiation reflected',\n            points: ['Light-colored surface', 'Stays cooler', 'Reduces the thermal load'],\n            cool: true,\n          },\n        ].map((item) => (\n          <article key={item.title} className=\"overflow-hidden rounded-2xl border border-white/10 bg-white/[0.045]\">\n            <div className=\"relative aspect-[1.1] overflow-hidden bg-[#0f1d2a] md:aspect-[1.18]\">\n              <img src={item.image} alt={item.title} className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n              <div aria-hidden=\"true\" className=\"absolute inset-x-0 bottom-0 h-2/3 bg-gradient-to-t from-[#142333] via-[#142333]/20 to-transparent\" />\n            </div>\n            <div className=\"p-5 lg:p-7\">\n              <div className=\"mb-6 flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\">\n                <h3 className=\"font-satoshi text-xl font-bold !leading-tight text-white lg:text-2xl\">\n                  {item.title}\n                </h3>\n                <div className={`shrink-0 rounded-xl border px-4 py-3 ${item.cool ? 'border-teal-vivid/18 bg-teal-vivid/10 text-teal-vivid' : 'border-terracotta/18 bg-terracotta/12 text-[#f0a084]'}`}>\n                  <span className=\"block font-satoshi text-2xl font-bold leading-none lg:text-3xl\">{item.metric}</span>\n                  <span className=\"mt-1 block font-body text-[10px] font-bold uppercase tracking-[0.14em] opacity-75\">\n                    {item.metricLabel}\n                  </span>\n                </div>\n              </div>\n              <ul className=\"grid gap-2.5\">\n                {item.points.map((point) => (\n                  <li key={point} className=\"flex items-start gap-2.5\">\n                    <CheckCircle2 className={`mt-0.5 h-4 w-4 shrink-0 ${item.cool ? 'text-teal-vivid' : 'text-[#f0a084]'}`} strokeWidth={2} />\n                    <span className=\"font-body text-sm leading-relaxed text-white/66\">{point}</span>\n                  </li>\n                ))}\n              </ul>\n            </div>\n          </article>\n        ))}\n      </div>\n\n      {(config.solution.points.length > 0 || config.solution.transition) && (\n        <ScrollReveal>\n          <div className=\"mx-auto mt-10 max-w-6xl lg:mt-14\">\n            {config.solution.points.length > 0 && (\n              <ul className=\"grid grid-cols-1 gap-3 md:grid-cols-4\">\n                {config.solution.points.map((point) => (\n                  <li key={point} className=\"flex items-center gap-3 rounded-xl border border-white/10 bg-white/[0.055] px-5 py-4\">\n                    <span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-teal-vivid/12\">\n                      <Check className=\"h-4 w-4 text-teal-vivid\" strokeWidth={1.8} />\n                    </span>\n                    <span className=\"font-body text-sm font-semibold leading-snug text-white/78\">{point}</span>\n                  </li>\n                ))}\n              </ul>\n            )}\n            {config.solution.transition && (\n              <p className=\"mx-auto mt-8 max-w-2xl text-center font-body text-sm leading-relaxed text-white/52\">\n                {config.solution.transition}\n              </p>\n            )}\n          </div>\n        </ScrollReveal>\n      )}\n    </div>\n  </section>\n);\n\nconst DurabilitySection = ({ config }: { config: SectorPageConfig }) => (\n  <section className=\"relative overflow-hidden bg-[#F6FAFB] py-16 lg:py-28\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto mb-12 max-w-2xl text-center lg:mb-16\">\n          <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n            Durability\n          </p>\n          <h2\n            className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\"\n            style={{ fontSize: 'clamp(2rem, 3.2vw, 2.85rem)', letterSpacing: '-0.03em' }}\n          >\n            {config.durability.title}\n            {config.durability.mutedTitle && (\n              <>\n                <br />\n                <span className=\"text-foreground/35\">{config.durability.mutedTitle}</span>\n              </>\n            )}\n          </h2>\n          <p className=\"font-body text-base leading-relaxed text-foreground/62 lg:text-[17px]\">\n            {config.durability.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n\n      <ScrollReveal>\n        <div className=\"mx-auto grid max-w-5xl grid-cols-1 items-stretch gap-5 lg:grid-cols-2 lg:gap-0\">\n          {[\n            {\n              title: 'Standard acrylic coating',\n              subtitle: 'Low cost to apply',\n              price: '~€10',\n              life: '2-5 years',\n              realCost: '€25-30',\n              covalba: false,\n              points: ['Reflectivity drops quickly', 'Chalking and yellowing', 'More frequent reapplication'],\n            },\n            {\n              title: 'Covalba polyurethane system',\n              subtitle: config.durability.covalbaLabel,\n              price: '€18-20',\n              life: '8-10 years',\n              realCost: '€18-20',\n              covalba: true,\n              points: ['Durable polyurethane resin', 'Anti-UV finishing varnish', 'Reflectivity retained longer'],\n            },\n          ].map((option) => (\n            <article\n              key={option.title}\n              className={`relative rounded-2xl px-7 py-9 shadow-[0_20px_60px_rgba(26,42,58,0.08)] lg:px-10 lg:py-12 ${\n                option.covalba ? 'z-10 bg-foreground text-white lg:-ml-5 lg:scale-[1.03]' : 'bg-white text-foreground lg:scale-[0.97] lg:opacity-90'\n              }`}\n            >\n              {option.covalba && (\n                <span className=\"absolute -top-4 left-1/2 inline-flex -translate-x-1/2 items-center rounded-full bg-teal-vivid px-4 py-2 font-body text-[11px] font-bold uppercase tracking-[0.15em] text-white\">\n                  The durable choice\n                </span>\n              )}\n              <h3 className=\"mb-2 font-satoshi text-2xl font-bold leading-tight lg:text-[1.7rem]\">{option.title}</h3>\n              <p className={`mb-8 font-body text-sm ${option.covalba ? 'text-white/52' : 'text-foreground/50'}`}>\n                {option.subtitle}\n              </p>\n              <div className=\"mb-8 grid grid-cols-3 gap-4\">\n                {[\n                  ['Price per m²', option.price],\n                  ['Service life', option.life],\n                  ['Over 10 years', option.realCost],\n                ].map(([label, value]) => (\n                  <div key={label}>\n                    <p className={`mb-1 font-body text-[10px] uppercase tracking-widest ${option.covalba ? 'text-white/42' : 'text-foreground/38'}`}>\n                      {label}\n                    </p>\n                    <p className={`font-satoshi text-2xl font-bold leading-none lg:text-3xl ${label === 'Over 10 years' ? (option.covalba ? 'text-teal-vivid' : 'text-terracotta') : ''}`}>\n                      {value}\n                    </p>\n                  </div>\n                ))}\n              </div>\n              <ul className=\"space-y-3 border-t border-current/10 pt-7\">\n                {option.points.map((point) => {\n                  const Icon = option.covalba ? Check : X;\n                  return (\n                    <li key={point} className=\"flex items-start gap-2.5\">\n                      <Icon className={`mt-0.5 h-4 w-4 shrink-0 ${option.covalba ? 'text-teal-vivid' : 'text-terracotta/70'}`} />\n                      <span className={`font-body text-sm leading-relaxed ${option.covalba ? 'text-white/70' : 'text-foreground/60'}`}>\n                        {point}\n                      </span>\n                    </li>\n                  );\n                })}\n              </ul>\n            </article>\n          ))}\n        </div>\n      </ScrollReveal>\n\n      <ScrollReveal>\n        <p className=\"mx-auto mt-10 max-w-3xl text-center font-body text-sm leading-relaxed text-foreground/55 lg:text-[15px]\">\n          {config.durability.note}\n        </p>\n      </ScrollReveal>\n    </div>\n  </section>\n);\n\nconst SpecialSection = ({ config }: { config: SectorPageConfig }) => {\n  const [submitted, setSubmitted] = useState(false);\n  const isFunding = config.special.kind === 'funding';\n\n  return (\n    <section className=\"relative overflow-hidden bg-white py-16 lg:py-28\">\n      <div className=\"container mx-auto px-4 lg:px-8\">\n        <ScrollReveal>\n          <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 items-end gap-7 lg:mb-14 lg:grid-cols-[0.9fr_1.1fr] lg:gap-16\">\n            <div>\n              <div className=\"mb-5 flex items-center gap-3\">\n                <span className=\"h-px w-10 bg-teal-vivid\" aria-hidden=\"true\" />\n                <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n                  {config.special.eyebrow}\n                </span>\n              </div>\n              <h2\n                className=\"font-satoshi font-bold !leading-[1.04] text-foreground\"\n                style={{ fontSize: 'clamp(1.95rem, 3vw, 2.75rem)', letterSpacing: '-0.03em' }}\n              >\n                {config.special.title}\n              </h2>\n            </div>\n            <p className=\"max-w-2xl font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n              {config.special.intro}\n            </p>\n          </div>\n        </ScrollReveal>\n\n        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-5 lg:grid-cols-[0.82fr_1.18fr] lg:gap-7\">\n          <ScrollReveal>\n            <div className=\"h-full rounded-2xl bg-cream/70 p-6 ring-1 ring-foreground/[0.06] lg:p-7\">\n              {!submitted ? (\n                <>\n                  <h3 className=\"mb-5 font-satoshi text-xl font-bold leading-tight text-foreground\">\n                    {isFunding ? 'Check my eligibility' : 'Estimate my savings'}\n                  </h3>\n                  <form\n                    className=\"grid gap-3\"\n                    onSubmit={(event) => {\n                      event.preventDefault();\n                      setSubmitted(true);\n                    }}\n                  >\n                    <select required className={lightFieldClass} defaultValue=\"\">\n                      <option value=\"\" disabled>\n                        Building type\n                      </option>\n                      {config.hero.formFields.typeOptions.map((option) => (\n                        <option key={option}>{option}</option>\n                      ))}\n                    </select>\n                    <input required min=\"1\" type=\"number\" className={lightFieldClass} placeholder=\"Roof surface (m²)\" />\n                    <input required type=\"email\" className={lightFieldClass} placeholder=\"Business email\" />\n                    <button className=\"group mt-1 inline-flex items-center justify-center gap-2 rounded-full bg-teal-vivid py-2.5 pl-6 pr-2 font-semibold text-white\">\n                      <span className=\"text-sm\">{config.special.cta}</span>\n                      <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20 transition-transform duration-500 group-hover:translate-x-0.5\">\n                        <ArrowRight className=\"h-3.5 w-3.5\" />\n                      </span>\n                    </button>\n                  </form>\n                </>\n              ) : (\n                <div className=\"flex min-h-[260px] flex-col items-center justify-center text-center\">\n                  <CheckCircle2 className=\"mb-4 h-12 w-12 text-teal-vivid\" strokeWidth={1.7} />\n                  <h3 className=\"mb-3 font-satoshi text-2xl font-bold text-foreground\">Request received.</h3>\n                  <p className=\"max-w-sm font-body text-sm leading-relaxed text-foreground/62\">\n                    Covalba will get back to you with a personalized response.\n                  </p>\n                </div>\n              )}\n            </div>\n          </ScrollReveal>\n\n          <ScrollReveal>\n            <div className=\"rounded-2xl bg-foreground p-6 text-white lg:p-8\">\n              {config.special.kind === 'decret' ? (\n                <div className=\"grid gap-4 sm:grid-cols-3\">\n                  {config.special.milestones.map((milestone) => (\n                    <div key={milestone.value} className=\"rounded-xl border border-white/10 bg-white/[0.04] p-5\">\n                      <p className=\"font-satoshi text-4xl font-bold leading-none text-teal-vivid\">{milestone.value}</p>\n                      <p className=\"mt-3 font-body text-sm text-white/62\">{milestone.label}</p>\n                    </div>\n                  ))}\n                </div>\n              ) : (\n                <div className=\"grid gap-4 sm:grid-cols-2\">\n                  {config.special.points.map((point) => (\n                    <div key={point.label} className=\"rounded-xl border border-white/10 bg-white/[0.04] p-5\">\n                      <p className=\"font-satoshi text-3xl font-bold leading-none text-teal-vivid\">{point.value}</p>\n                      <p className=\"mt-3 font-body text-sm text-white/62\">{point.label}</p>\n                    </div>\n                  ))}\n                </div>\n              )}\n              {config.special.kind === 'decret' && (\n                <div className=\"mt-6 grid gap-3\">\n                  {config.special.points.map((point) => (\n                    <div key={point} className=\"flex items-start gap-3\">\n                      <CheckCircle2 className=\"mt-0.5 h-4 w-4 shrink-0 text-teal-vivid\" />\n                      <span className=\"font-body text-sm leading-relaxed text-white/68\">{point}</span>\n                    </div>\n                  ))}\n                </div>\n              )}\n            </div>\n            <p className=\"mt-5 rounded-2xl bg-cream/70 p-5 font-body text-xs leading-relaxed text-foreground/58 lg:text-[13px]\">\n              {config.special.note}\n            </p>\n          </ScrollReveal>\n        </div>\n      </div>\n    </section>\n  );\n};\n\nconst BenefitsSection = ({ config }: { config: SectorPageConfig }) => (\n  <>\n    <section className=\"relative overflow-hidden bg-cream pb-12 pt-16 lg:min-h-[640px] lg:pb-8 lg:pt-20\">\n      <figure className=\"absolute right-0 top-0 hidden h-full min-h-[640px] w-[58vw] overflow-hidden lg:block\">\n        <img src={config.benefits.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n        <div aria-hidden=\"true\" className=\"absolute inset-y-0 left-0 w-[56%] bg-gradient-to-r from-cream via-cream/88 to-transparent\" />\n      </figure>\n      <div className=\"container relative z-10 mx-auto px-4 lg:px-8\">\n        <ScrollReveal>\n          <div className=\"max-w-[760px]\">\n            <div className=\"mb-5 flex items-center gap-3 lg:mb-7\">\n              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n                {config.benefits.eyebrow}\n              </span>\n            </div>\n            <h2\n              className=\"mb-6 font-satoshi font-bold !leading-[1.04] text-foreground\"\n              style={{ fontSize: 'clamp(2.15rem, 3vw, 3rem)' }}\n            >\n              {config.benefits.title}\n            </h2>\n            <p className=\"max-w-[540px] font-body text-base leading-relaxed text-foreground/72 lg:text-[16px]\">\n              {config.benefits.desc}\n            </p>\n            <div className=\"relative z-10 mt-7 max-w-[540px] rounded-2xl bg-white/96 p-6 shadow-[0_22px_70px_-45px_hsl(var(--navy)/0.35)] ring-1 ring-foreground/[0.05]\">\n              <div className=\"grid grid-cols-[48px_minmax(0,1fr)] items-center gap-5\">\n                <Thermometer className=\"h-12 w-12 text-primary\" strokeWidth={1.55} />\n                <div>\n                  <p className=\"mb-3 font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n                    From the first summer\n                  </p>\n                  <p className=\"font-satoshi text-[3.1rem] font-bold leading-[0.88] text-primary\">{config.benefits.metric}</p>\n                  <p className=\"mt-2 font-satoshi text-xl font-bold leading-tight text-foreground\">{config.benefits.metricLabel}</p>\n                </div>\n              </div>\n            </div>\n          </div>\n        </ScrollReveal>\n      </div>\n    </section>\n\n    <section className=\"relative overflow-hidden bg-white py-14\">\n      <div className=\"container relative mx-auto px-4 lg:px-8\">\n        <ScrollReveal stagger>\n          <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5 lg:gap-4\">\n            {config.benefits.cards.map((benefit, index) => {\n              const Icon = benefit.icon;\n              return (\n                <article key={benefit.title} className=\"min-h-[184px] rounded-2xl bg-cream/65 p-5 ring-1 ring-foreground/[0.05] lg:p-6\">\n                  <div className=\"mb-7 flex h-11 w-11 items-center justify-center rounded-xl bg-white text-primary\">\n                    <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n                  </div>\n                  <span className=\"mb-3 block font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary/70\">\n                    0{index + 1}\n                  </span>\n                  <h3 className=\"font-satoshi text-lg font-bold leading-tight text-foreground lg:text-[19px]\">{benefit.title}</h3>\n                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/62\">{benefit.desc}</p>\n                </article>\n              );\n            })}\n          </div>\n        </ScrollReveal>\n        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n          {config.benefits.transition}\n        </p>\n      </div>\n    </section>\n  </>\n);\n\nconst ApplicationsSection = ({ config }: { config: SectorPageConfig }) => (\n  <section className=\"relative overflow-hidden bg-cream py-16 lg:py-24\">\n    <div className=\"container relative mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto mb-10 grid max-w-6xl grid-cols-1 gap-6 lg:mb-12 lg:grid-cols-[0.9fr_1.1fr] lg:items-end lg:gap-16\">\n          <div>\n            <div className=\"mb-5 flex items-center gap-3\">\n              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">\n                {config.applications.eyebrow}\n              </span>\n            </div>\n            <h2\n              className=\"font-satoshi font-bold !leading-[1.05] text-foreground\"\n              style={{ fontSize: 'clamp(2rem, 3vw, 3rem)' }}\n            >\n              {config.applications.title}\n            </h2>\n          </div>\n          <p className=\"max-w-[540px] border-l border-primary/30 pl-6 font-body text-base leading-relaxed text-foreground/68 lg:text-[16px]\">\n            {config.applications.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n      <ScrollReveal stagger>\n        <div className=\"mx-auto grid max-w-6xl grid-cols-1 gap-4 lg:grid-cols-5 lg:gap-5\">\n          {config.applications.cards.map((card, index) => {\n            const Icon = card.icon;\n            return (\n              <article key={card.title} className=\"overflow-hidden rounded-2xl bg-white shadow-[0_16px_46px_-38px_hsl(var(--navy)/0.34)] ring-1 ring-foreground/[0.06]\">\n                <div className=\"aspect-[4/3] overflow-hidden bg-foreground/[0.04]\">\n                  <img src={card.image} alt=\"\" className=\"size-full object-cover\" loading=\"lazy\" decoding=\"async\" />\n                </div>\n                <div className=\"p-5\">\n                  <div className=\"mb-4 flex items-center justify-between gap-3\">\n                    <span className=\"inline-flex items-center gap-2 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-primary\">\n                      <Icon className=\"h-5 w-5\" strokeWidth={1.55} />\n                      {card.label}\n                    </span>\n                    <span className=\"font-body text-xs font-bold text-foreground/22\">0{index + 1}</span>\n                  </div>\n                  <h3 className=\"font-satoshi text-xl font-bold leading-tight text-foreground\">{card.title}</h3>\n                  <p className=\"mt-2 font-body text-sm leading-snug text-foreground/60\">{card.desc}</p>\n                </div>\n              </article>\n            );\n          })}\n        </div>\n      </ScrollReveal>\n      {config.applications.transition && (\n        <p className=\"mx-auto mt-10 max-w-2xl text-center font-body text-sm leading-relaxed text-foreground/54\">\n          {config.applications.transition}\n        </p>\n      )}\n    </div>\n  </section>\n);\n\nconst MethodSection = ({ config }: { config: SectorPageConfig }) => {\n  const [videoOpen, setVideoOpen] = useState(false);\n  const icons = [ClipboardCheck, CalendarClock, Shield, TrendingDown];\n  return (\n    <section className=\"bg-white py-16 lg:py-32\">\n      <div className=\"container mx-auto px-4 lg:px-8\">\n        <div className=\"flex flex-col items-start gap-12 lg:flex-row lg:gap-20\">\n          <div className=\"lg:sticky lg:top-[120px] lg:w-[40%]\">\n            <ScrollReveal>\n              <p className=\"mb-6 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/50\">\n                {config.method.eyebrow}\n              </p>\n              <h2\n                className=\"mb-6 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] sm:text-4xl lg:text-[3rem]\"\n                style={{ letterSpacing: '-0.03em' }}\n              >\n                {config.method.title}\n                <span className=\"text-foreground/30\"> {config.method.mutedTitle}</span>\n              </h2>\n              <p className=\"mb-8 font-body text-base leading-relaxed text-muted-foreground lg:text-lg\">\n                {config.method.intro}\n              </p>\n              <button onClick={() => setVideoOpen(true)} className=\"group flex items-center gap-3 text-primary\">\n                <div className=\"flex h-12 w-12 items-center justify-center rounded-full bg-primary/10\">\n                  <Play className=\"h-5 w-5\" />\n                </div>\n                <span className=\"font-body text-sm font-semibold\">Watch a project in 2 minutes</span>\n              </button>\n            </ScrollReveal>\n          </div>\n          <div className=\"relative lg:w-[60%]\">\n            <div className=\"absolute bottom-4 left-5 top-4 w-px bg-gradient-to-b from-primary/25 via-primary/10 to-transparent lg:left-6\" />\n            {config.method.steps.map((step, index) => {\n              const Icon = icons[index] ?? ClipboardCheck;\n              return (\n                <ScrollReveal key={step.title}>\n                  <div className=\"group relative flex items-start gap-5 py-8 lg:gap-7 lg:py-10\">\n                    <div className=\"relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full border border-primary/20 bg-primary/10 lg:h-12 lg:w-12\">\n                      <Icon className=\"h-4 w-4 text-primary lg:h-5 lg:w-5\" />\n                    </div>\n                    <div className=\"pt-1\">\n                      <span className=\"mb-2 block font-body text-xs font-bold uppercase tracking-widest text-primary/50\">\n                        Step 0{index + 1}\n                      </span>\n                      <h3 className=\"mb-2 text-xl text-foreground lg:text-2xl\">{step.title}</h3>\n                      <p className=\"max-w-md font-body text-sm leading-relaxed text-muted-foreground lg:text-base\">{step.text}</p>\n                    </div>\n                  </div>\n                  {index < config.method.steps.length - 1 && <div className=\"ml-5 h-px bg-border lg:ml-6\" />}\n                </ScrollReveal>\n              );\n            })}\n            <p className=\"ml-16 mt-4 font-body text-xs font-medium text-muted-foreground/50 lg:ml-20\">\n              {config.method.duration}\n            </p>\n          </div>\n        </div>\n      </div>\n      <Dialog open={videoOpen} onOpenChange={setVideoOpen}>\n        <DialogContent className=\"max-w-4xl overflow-hidden border-none bg-black p-0\">\n          <div className=\"aspect-video\">\n            <iframe\n              src=\"https://www.youtube.com/embed/9HOB5OVH0Ac?autoplay=1\"\n              className=\"h-full w-full\"\n              allow=\"autoplay; encrypted-media\"\n              allowFullScreen\n              title=\"Covalba Cool Roof, a project in 2 minutes\"\n            />\n          </div>\n        </DialogContent>\n      </Dialog>\n    </section>\n  );\n};\n\nconst ProofSection = ({ config }: { config: SectorPageConfig }) => (\n  <section className=\"relative overflow-hidden bg-[#192A3A] py-24 lg:py-36\">\n    <div className=\"container relative mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mb-9 flex items-center gap-3 lg:mb-12\">\n          <span className=\"h-px w-12 bg-teal-vivid/70\" aria-hidden=\"true\" />\n          <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n            {config.proof.eyebrow}\n          </span>\n        </div>\n        <div className=\"mb-14 grid grid-cols-1 items-start gap-8 lg:mb-20 lg:grid-cols-[3fr_2fr] lg:gap-16\">\n          <h2\n            className=\"font-satoshi font-bold text-white !leading-[1.05]\"\n            style={{ fontSize: 'clamp(1.875rem, 3.8vw, 3rem)', letterSpacing: '-0.03em' }}\n          >\n            {config.proof.title}\n            <br />\n            <span className=\"text-teal-vivid\">{config.proof.mutedTitle}</span>\n          </h2>\n          <p className=\"max-w-[470px] font-body text-base leading-relaxed text-white/65 lg:mt-2 lg:text-[16px]\">\n            {config.proof.intro}\n          </p>\n        </div>\n      </ScrollReveal>\n      <ScrollReveal stagger>\n        <div className=\"mb-12 grid grid-cols-1 gap-4 md:grid-cols-3 lg:gap-5\">\n          {config.proof.figures.map((figure) => {\n            const Icon = figure.icon;\n            return (\n              <div key={figure.label} className=\"rounded-2xl border border-white/10 bg-white/[0.04] p-8 lg:p-9\">\n                <div className=\"mb-6 flex h-11 w-11 items-center justify-center rounded-full bg-teal-vivid/[0.12]\">\n                  <Icon className=\"h-5 w-5 text-teal-vivid\" strokeWidth={1.6} />\n                </div>\n                <p className=\"mb-3 font-satoshi text-4xl font-bold leading-none text-white\">{figure.value}</p>\n                <p className=\"font-body text-sm leading-relaxed text-white/60\">{figure.label}</p>\n              </div>\n            );\n          })}\n        </div>\n      </ScrollReveal>\n      {config.proof.cases && (\n        <div className=\"mb-12 grid gap-4 md:grid-cols-2\">\n          {config.proof.cases.map((item) => (\n            <div key={item.name} className=\"rounded-2xl border border-white/10 bg-white/[0.04] p-6\">\n              <h3 className=\"mb-2 font-satoshi text-xl font-bold text-white\">{item.name}</h3>\n              <p className=\"font-body text-sm leading-relaxed text-white/60\">{item.desc}</p>\n            </div>\n          ))}\n        </div>\n      )}\n      <div className=\"border-t border-white/10 pt-10\">\n        <div className=\"flex flex-wrap items-center justify-center gap-x-10 gap-y-7 lg:gap-x-14\">\n          {config.proof.logos.map((logo) =>\n            logo.url ? (\n              <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center\">\n                <img\n                  src={logo.url}\n                  alt={logo.name}\n                  className=\"max-h-7 max-w-full object-contain opacity-45\"\n                  style={{ filter: 'brightness(0) invert(1)' }}\n                  loading=\"lazy\"\n                  decoding=\"async\"\n                />\n              </span>\n            ) : (\n              <span key={logo.name} className=\"flex h-8 w-28 items-center justify-center font-satoshi text-lg font-bold text-white/50\">{logo.name}</span>\n            )\n          )}\n        </div>\n        <p className=\"mx-auto mt-9 max-w-2xl text-center font-body text-sm leading-relaxed text-white/70\">\n          {config.proof.transition}\n        </p>\n      </div>\n    </div>\n  </section>\n);\n\nconst FaqSection = ({ config }: { config: SectorPageConfig }) => (\n  <section className=\"bg-cream py-20 lg:py-32\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"grid items-start gap-10 lg:grid-cols-[0.85fr_1.15fr] lg:gap-16\">\n          <div className=\"lg:sticky lg:top-24\">\n            <div className=\"mb-5 flex items-center gap-3\">\n              <span className=\"h-px w-10 bg-primary/70\" aria-hidden=\"true\" />\n              <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-primary\">FAQ</span>\n            </div>\n            <h2 className=\"mb-5 font-satoshi font-bold text-foreground !leading-[1.05]\" style={{ fontSize: 'clamp(2rem, 3.3vw, 3rem)', letterSpacing: '-0.03em' }}>\n              Your questions,\n              <br />\n              <span className=\"text-foreground/40\">our answers.</span>\n            </h2>\n            <p className=\"max-w-[420px] font-body text-base leading-relaxed text-foreground/65 lg:text-[15.5px]\">\n              {config.faq.intro}\n            </p>\n            <a href={`#contact-${config.slug}`} className=\"group mt-8 inline-flex items-center gap-2 text-sm font-semibold text-primary\">\n              Another question? Let's talk\n              <ArrowRight className=\"h-4 w-4\" />\n            </a>\n          </div>\n          <Accordion type=\"single\" collapsible className=\"space-y-3\">\n            {config.faq.items.map((faq, index) => (\n              <AccordionItem key={faq.q} value={`${config.slug}-faq-${index}`} className=\"rounded-xl border border-foreground/[0.06] bg-white px-5 shadow-[0_12px_34px_rgba(24,42,58,0.04)] lg:px-6\">\n                <AccordionTrigger className=\"py-5 text-left font-satoshi text-base font-bold text-foreground hover:no-underline lg:text-[17px]\">\n                  {faq.q}\n                </AccordionTrigger>\n                <AccordionContent className=\"pb-5 font-body text-[14.5px] leading-relaxed text-foreground/67 lg:text-[15px]\">\n                  {faq.a}\n                </AccordionContent>\n              </AccordionItem>\n            ))}\n          </Accordion>\n        </div>\n      </ScrollReveal>\n    </div>\n  </section>\n);\n\nconst FinalCta = ({ config }: { config: SectorPageConfig }) => (\n  <section id={`contact-${config.slug}`} className=\"overflow-hidden bg-[#182A3A] py-20 lg:py-32\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <ScrollReveal>\n        <div className=\"mx-auto max-w-4xl text-center\">\n          <div className=\"mb-6 inline-flex items-center gap-3\">\n            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n            <span className=\"font-body text-[11px] font-bold uppercase tracking-[0.22em] text-teal-vivid\">\n              {config.finalCta.eyebrow}\n            </span>\n            <span className=\"h-px w-8 bg-teal-vivid/70\" aria-hidden=\"true\" />\n          </div>\n          <h2 className=\"mb-6 font-satoshi font-bold text-white !leading-[1.04]\" style={{ fontSize: 'clamp(2rem, 3.8vw, 3.5rem)', letterSpacing: '-0.03em' }}>\n            {config.finalCta.title}\n          </h2>\n          <p className=\"mx-auto mb-9 max-w-2xl font-body text-base leading-relaxed text-white/[0.72] lg:text-[17px]\">\n            {config.finalCta.desc}\n          </p>\n          <div className=\"flex flex-col items-stretch justify-center gap-3 sm:flex-row sm:items-center\">\n            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full cta-gradient py-2.5 pl-6 pr-2 font-semibold text-white\">\n              <span className=\"text-sm\">Request a quote</span>\n              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/20\">\n                <ArrowRight className=\"h-3.5 w-3.5\" />\n              </span>\n            </a>\n            <a href=\"/en\" className=\"group inline-flex items-center justify-center gap-2 rounded-full border border-white/[0.22] py-2.5 pl-6 pr-2 font-semibold text-white/[0.88]\">\n              <span className=\"text-sm\">Talk to an expert</span>\n              <span className=\"flex h-8 w-8 items-center justify-center rounded-full bg-white/[0.12]\">\n                <ArrowRight className=\"h-3.5 w-3.5\" />\n              </span>\n            </a>\n          </div>\n        </div>\n      </ScrollReveal>\n      <ul className=\"mx-auto mt-12 grid max-w-3xl gap-3 sm:grid-cols-3\">\n        {config.finalCta.reassurances.map((item, index) => {\n          const icons = [CalendarCheck, BadgeCheck, Shield];\n          const Icon = icons[index] ?? BadgeCheck;\n          return (\n            <li key={item} className=\"flex items-center justify-center gap-2.5 rounded-lg border border-white/[0.12] bg-white/[0.045] px-4 py-3\">\n              <Icon className=\"h-4 w-4 shrink-0 text-teal-vivid\" strokeWidth={1.8} />\n              <span className=\"font-body text-sm text-white/[0.76]\">{item}</span>\n            </li>\n          );\n        })}\n      </ul>\n    </div>\n  </section>\n);\n\nconst SeoContent = ({ config }: { config: SectorPageConfig }) => (\n  <section className=\"bg-cream py-16 lg:py-28\">\n    <div className=\"container mx-auto px-4 lg:px-8\">\n      <div className=\"mx-auto max-w-5xl\">\n        <p className=\"mb-5 font-body text-[10px] font-semibold uppercase tracking-[0.25em] text-primary/55\">\n          {config.seo.eyebrow}\n        </p>\n        <h2 className=\"mb-5 font-satoshi text-3xl font-bold text-foreground !leading-[1.05] lg:text-5xl\">\n          {config.seo.title}\n        </h2>\n        <p className=\"mb-12 max-w-3xl font-body text-base leading-relaxed text-foreground/64\">\n          {config.seo.intro}\n        </p>\n        <div className=\"grid gap-10 md:grid-cols-2\">\n          {config.seo.sections.map((section) => (\n            <article key={section.title}>\n              <h3 className=\"mb-3 font-satoshi text-xl font-bold text-foreground\">{section.title}</h3>\n              <p className=\"font-body text-sm leading-relaxed text-foreground/68\">{section.body}</p>\n            </article>\n          ))}\n        </div>\n        <div className=\"mt-12 border-t border-foreground/10 pt-8\">\n          <p className=\"mb-4 font-body text-[11px] font-bold uppercase tracking-[0.18em] text-foreground/38\">Sources</p>\n          <ul className=\"grid gap-2 font-body text-xs leading-relaxed text-foreground/50 md:grid-cols-2\">\n            {config.seo.sources.map((source) => (\n              <li key={source}>{source}</li>\n            ))}\n          </ul>\n        </div>\n      </div>\n    </div>\n  </section>\n);\n\nexport const SectorPageTemplateEN = ({ config }: { config: SectorPageConfig }) => (\n  <>\n    <Seo config={config} />\n    <SectorHero config={config} />\n    <ReassuranceBand items={config.reassurance} />\n    <ProblemSection config={config} />\n    <SolutionSection config={config} />\n    <DurabilitySection config={config} />\n    <SpecialSection config={config} />\n    <BenefitsSection config={config} />\n    <ApplicationsSection config={config} />\n    <MethodSection config={config} />\n    <ProofSection config={config} />\n    <FaqSection config={config} />\n    <FinalCta config={config} />\n    <SeoContent config={config} />\n  </>\n);\n\nexport const defaultIconsEN = {\n  Building2,\n  HelpCircle,\n  Shield,\n  Thermometer,\n  TrendingDown,\n  UsersRound,\n};\n","numLines":1145,"startLine":1,"totalLines":1145}},"sourceToolAssistantUUID":"8fdeb9df-0f26-46cb-8e2e-2a0f5cdd4c67","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"b225ac5b-6b97-442e-b737-9b0dfbfbddd1","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_016GpZeT1wZx1EPV3pkeUQrY","type":"message","role":"assistant","content":[{"type":"text","text":"Now I understand the structure. Key observation: `SectorPageTemplateEN` renders `<SpecialSection>` **unconditionally** — it always accesses `config.special.kind`, `config.special.eyebrow`, etc. The EN copy has NO `special` block (France-specific CEE/décret stripped). \n\nI need to check how another EN page that omits `special` handles this, or whether `special` is optional in the type. Let me check the `SectorPageConfig` type and look for an existing EN page that omits `special`."}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":53643,"cache_read_input_tokens":50033,"cache_creation":{"ephemeral_5m_input_tokens":53643,"ephemeral_1h_input_tokens":0},"output_tokens":4,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHF15ZVRTQns2hxgUBMs","attributionAgent":"general-purpose","type":"assistant","uuid":"6501bd51-e673-4fc9-abeb-0a554babafd1","timestamp":"2026-06-21T23:05:13.572Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"6501bd51-e673-4fc9-abeb-0a554babafd1","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_016GpZeT1wZx1EPV3pkeUQrY","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01XPJAaZ4KNXxUuJfLRPadBi","name":"Bash","input":{"command":"grep -n \"special\" src/components/industries/SectorPageTemplate.tsx | head -30; echo \"---EN PAGES---\"; ls src/pages/en/industries/ 2>/dev/null"},"caller":{"type":"direct"}}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":53643,"cache_read_input_tokens":50033,"cache_creation":{"ephemeral_5m_input_tokens":53643,"ephemeral_1h_input_tokens":0},"output_tokens":4,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHF15ZVRTQns2hxgUBMs","attributionAgent":"general-purpose","type":"assistant","uuid":"4d09f2eb-215d-4ff6-8ecb-cbd917dc7480","timestamp":"2026-06-21T23:05:14.866Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"4d09f2eb-215d-4ff6-8ecb-cbd917dc7480","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"type":"tool_result","content":"Exit code 2\n173:  special: SpecialSection;\n798:  const isFunding = config.special.kind === 'funding';\n809:                  {config.special.eyebrow}\n816:                {config.special.title}\n820:              {config.special.intro}\n851:                      <span className=\"text-sm\">{config.special.cta}</span>\n872:              {config.special.kind === 'decret' ? (\n874:                  {config.special.milestones.map((milestone) => (\n883:                  {config.special.points.map((point) => (\n891:              {config.special.kind === 'decret' && (\n893:                  {config.special.points.map((point) => (\n903:              {config.special.note}\n---EN PAGES---","is_error":true,"tool_use_id":"toolu_01XPJAaZ4KNXxUuJfLRPadBi"}]},"uuid":"e4e27cab-5dcc-44f1-a3aa-019a5ea6058e","timestamp":"2026-06-21T23:05:14.944Z","toolUseResult":"Error: Exit code 2\n173:  special: SpecialSection;\n798:  const isFunding = config.special.kind === 'funding';\n809:                  {config.special.eyebrow}\n816:                {config.special.title}\n820:              {config.special.intro}\n851:                      <span className=\"text-sm\">{config.special.cta}</span>\n872:              {config.special.kind === 'decret' ? (\n874:                  {config.special.milestones.map((milestone) => (\n883:                  {config.special.points.map((point) => (\n891:              {config.special.kind === 'decret' && (\n893:                  {config.special.points.map((point) => (\n903:              {config.special.note}\n---EN PAGES---","sourceToolAssistantUUID":"4d09f2eb-215d-4ff6-8ecb-cbd917dc7480","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"e4e27cab-5dcc-44f1-a3aa-019a5ea6058e","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_013gn92rxGT1m1o37XZgsJsH","type":"message","role":"assistant","content":[{"type":"text","text":"No EN industries pages exist yet. `special` is a required field (`special: SpecialSection`) and `SectorPageTemplateEN` always renders `<SpecialSection>`. Let me check the type definition and look at existing EN pages to see how others handled the missing `special` (e.g. RetailEN, LogisticsEN if they exist)."}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":515,"cache_read_input_tokens":103676,"cache_creation":{"ephemeral_5m_input_tokens":515,"ephemeral_1h_input_tokens":0},"output_tokens":1,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHF1Va7yJ6PVg54PzWEb","attributionAgent":"general-purpose","type":"assistant","uuid":"bd0f264a-008f-4e8a-a79a-a054b65b2e8d","timestamp":"2026-06-21T23:05:18.055Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"bd0f264a-008f-4e8a-a79a-a054b65b2e8d","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_013gn92rxGT1m1o37XZgsJsH","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01XiGoMAjDuht6Ck6wzHJAKD","name":"Read","input":{"file_path":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/components/industries/SectorPageTemplate.tsx","offset":100,"limit":90},"caller":{"type":"direct"}}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":515,"cache_read_input_tokens":103676,"cache_creation":{"ephemeral_5m_input_tokens":515,"ephemeral_1h_input_tokens":0},"output_tokens":1,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHF1Va7yJ6PVg54PzWEb","attributionAgent":"general-purpose","type":"assistant","uuid":"ea66f605-2a8d-4658-bc6d-766fa74a35ad","timestamp":"2026-06-21T23:05:19.999Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"ea66f605-2a8d-4658-bc6d-766fa74a35ad","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_01XiGoMAjDuht6Ck6wzHJAKD","type":"tool_result","content":"100\t      intro: string;\n101\t      milestones: Array<{ value: string; label: string }>;\n102\t      points: string[];\n103\t      note: string;\n104\t      cta: string;\n105\t    }\n106\t  | {\n107\t      kind: 'funding';\n108\t      eyebrow: string;\n109\t      title: string;\n110\t      intro: string;\n111\t      points: Array<{ value: string; label: string }>;\n112\t      note: string;\n113\t      cta: string;\n114\t    };\n115\t\n116\texport type SectorPageConfig = {\n117\t  slug: string;\n118\t  title: string;\n119\t  description: string;\n120\t  canonicalPath: string;\n121\t  serviceName: string;\n122\t  serviceDescription: string;\n123\t  audience: string;\n124\t  reassurance?: string[];\n125\t  hero: {\n126\t    eyebrow: string;\n127\t    h1: string;\n128\t    sub: string;\n129\t    image: string;\n130\t    imageAlt: string;\n131\t    stats: HeroStat[];\n132\t    formTitle: string;\n133\t    formSubtitle: string;\n134\t    formFields: {\n135\t      typeLabel: string;\n136\t      typeOptions: string[];\n137\t      climateLabel: string;\n138\t      climateOptions: string[];\n139\t      yearLabel: string;\n140\t      microcopy: string;\n141\t      cta: string;\n142\t    };\n143\t  };\n144\t  logos: {\n145\t    title: string;\n146\t    items: Logo[];\n147\t  };\n148\t  problem: {\n149\t    eyebrow: string;\n150\t    title: string;\n151\t    mutedTitle: string;\n152\t    intro: string;\n153\t    transition: string;\n154\t    cards: Problem[];\n155\t  };\n156\t  solution: {\n157\t    eyebrow: string;\n158\t    title: string;\n159\t    mutedTitle: string;\n160\t    intro: string;\n161\t    points: string[];\n162\t    transition: string;\n163\t    beforeImage?: string;\n164\t    afterImage?: string;\n165\t  };\n166\t  durability: {\n167\t    title: string;\n168\t    mutedTitle?: string;\n169\t    intro: string;\n170\t    note: string;\n171\t    covalbaLabel: string;\n172\t  };\n173\t  special: SpecialSection;\n174\t  benefits: {\n175\t    eyebrow: string;\n176\t    title: string;\n177\t    desc: string;\n178\t    metric: string;\n179\t    metricLabel: string;\n180\t    image: string;\n181\t    imageAlt: string;\n182\t    cards: Benefit[];\n183\t    transition: string;\n184\t  };\n185\t  applications: {\n186\t    eyebrow: string;\n187\t    title: string;\n188\t    intro: string;\n189\t    cards: Application[];"}]},"uuid":"ff11e63c-69de-4ce9-90b4-e61d7a1dd7dc","timestamp":"2026-06-21T23:05:20.040Z","toolUseResult":{"type":"text","file":{"filePath":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/components/industries/SectorPageTemplate.tsx","content":"      intro: string;\n      milestones: Array<{ value: string; label: string }>;\n      points: string[];\n      note: string;\n      cta: string;\n    }\n  | {\n      kind: 'funding';\n      eyebrow: string;\n      title: string;\n      intro: string;\n      points: Array<{ value: string; label: string }>;\n      note: string;\n      cta: string;\n    };\n\nexport type SectorPageConfig = {\n  slug: string;\n  title: string;\n  description: string;\n  canonicalPath: string;\n  serviceName: string;\n  serviceDescription: string;\n  audience: string;\n  reassurance?: string[];\n  hero: {\n    eyebrow: string;\n    h1: string;\n    sub: string;\n    image: string;\n    imageAlt: string;\n    stats: HeroStat[];\n    formTitle: string;\n    formSubtitle: string;\n    formFields: {\n      typeLabel: string;\n      typeOptions: string[];\n      climateLabel: string;\n      climateOptions: string[];\n      yearLabel: string;\n      microcopy: string;\n      cta: string;\n    };\n  };\n  logos: {\n    title: string;\n    items: Logo[];\n  };\n  problem: {\n    eyebrow: string;\n    title: string;\n    mutedTitle: string;\n    intro: string;\n    transition: string;\n    cards: Problem[];\n  };\n  solution: {\n    eyebrow: string;\n    title: string;\n    mutedTitle: string;\n    intro: string;\n    points: string[];\n    transition: string;\n    beforeImage?: string;\n    afterImage?: string;\n  };\n  durability: {\n    title: string;\n    mutedTitle?: string;\n    intro: string;\n    note: string;\n    covalbaLabel: string;\n  };\n  special: SpecialSection;\n  benefits: {\n    eyebrow: string;\n    title: string;\n    desc: string;\n    metric: string;\n    metricLabel: string;\n    image: string;\n    imageAlt: string;\n    cards: Benefit[];\n    transition: string;\n  };\n  applications: {\n    eyebrow: string;\n    title: string;\n    intro: string;\n    cards: Application[];","numLines":90,"startLine":100,"totalLines":1353}},"sourceToolAssistantUUID":"ea66f605-2a8d-4658-bc6d-766fa74a35ad","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"ff11e63c-69de-4ce9-90b4-e61d7a1dd7dc","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_013gn92rxGT1m1o37XZgsJsH","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01Tx6EsycUhwmTAXwuFoEx72","name":"Bash","input":{"command":"ls src/pages/en/ 2>/dev/null; echo \"---grep SectorPageTemplateEN usage---\"; grep -rln \"SectorPageTemplateEN\" src/pages/ 2>/dev/null"},"caller":{"type":"direct"}}],"stop_reason":"tool_use","stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":515,"cache_read_input_tokens":103676,"output_tokens":372,"server_tool_use":{"web_search_requests":0,"web_fetch_requests":0},"service_tier":"standard","cache_creation":{"ephemeral_1h_input_tokens":0,"ephemeral_5m_input_tokens":515},"inference_geo":"not_available","iterations":[{"input_tokens":2,"output_tokens":372,"cache_read_input_tokens":103676,"cache_creation_input_tokens":515,"cache_creation":{"ephemeral_5m_input_tokens":515,"ephemeral_1h_input_tokens":0},"type":"message"}],"speed":"standard"},"diagnostics":null},"requestId":"req_011CcHF1Va7yJ6PVg54PzWEb","attributionAgent":"general-purpose","type":"assistant","uuid":"ad0df2a6-a101-4917-b63c-e540fd524bb3","timestamp":"2026-06-21T23:05:20.516Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"ad0df2a6-a101-4917-b63c-e540fd524bb3","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_01Tx6EsycUhwmTAXwuFoEx72","type":"tool_result","content":"CommercialEN.tsx\nCovaThermEN.tsx\nHomeEN.tsx\n---grep SectorPageTemplateEN usage---","is_error":false}]},"uuid":"2a04c214-6c3b-4dd0-8abc-9f85f09bae1f","timestamp":"2026-06-21T23:05:20.610Z","toolUseResult":{"stdout":"CommercialEN.tsx\nCovaThermEN.tsx\nHomeEN.tsx\n---grep SectorPageTemplateEN usage---","stderr":"","interrupted":false,"isImage":false,"returnCodeInterpretation":"No matches found","noOutputExpected":false},"sourceToolAssistantUUID":"ad0df2a6-a101-4917-b63c-e540fd524bb3","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"2a04c214-6c3b-4dd0-8abc-9f85f09bae1f","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01XcDsZwfMJxYFH9iLFDnb9d","type":"message","role":"assistant","content":[{"type":"text","text":"No EN page yet uses `SectorPageTemplateEN`, so I'm the first. The challenge: `special` is required by the type AND rendered unconditionally by the template, but the EN copy strips the France-specific CEE/décret block.\n\nThe ERP `special` block is the décret/CEE block — France-specific. The task says OMIT it. But the template will crash if `config.special` is undefined. \n\nThe cleanest approach respecting \"OMIT any France-specific config block — map whatever the EN copy provides instead\": the EN copy provides nothing for `special`. But the type requires it and the template renders it unconditionally. CommercialEN avoided this by NOT using the template (it has its own components and a `value` section instead).\n\nLet me check the type more precisely — is `special` optional in any union, and does the template guard it? It does NOT guard. The intended design clearly expects `special` always present. Since I must use `SectorPageTemplateEN`, I'll provide a `special` block built from EN copy content that is NOT France-specific. The EN copy has no special-section strings, so I'll repurpose a generic non-France angle. \n\nActually, the better solution: make the template tolerate a missing `special`. But task says do NOT modify other files. So I must supply a valid `special` object. Let me build a `funding`/`decret`-free generic block. The cleanest is to reuse benefits-adjacent EN content into a `decret`-shaped block but WITHOUT France regulatory references. However any \"décret tertiaire/CEE\" is France-specific and forbidden.\n\nLet me reconsider: a generic `decret`-kind section needs milestones + points. I can craft a non-France \"durability/value\" angle from existing EN copy. But that risks inventing content. The safest move that honors both constraints (use template, omit France block, only use provided EN text) is to verify whether `special` can be `undefined` at runtime without TS error — it can't (required). \n\nLet me check the full SpecialSection union start to confirm there's no third optional variant."}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":131,"cache_creation_input_tokens":1367,"cache_read_input_tokens":104191,"cache_creation":{"ephemeral_5m_input_tokens":1367,"ephemeral_1h_input_tokens":0},"output_tokens":1,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHF1v9jDSngUaDUyeqav","attributionAgent":"general-purpose","type":"assistant","uuid":"3e3e3c57-42e0-467f-aba7-a018684e27a7","timestamp":"2026-06-21T23:05:32.451Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"3e3e3c57-42e0-467f-aba7-a018684e27a7","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01XcDsZwfMJxYFH9iLFDnb9d","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_013ZiwoKwJkRohUtWFJGqhpk","name":"Read","input":{"file_path":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/components/industries/SectorPageTemplate.tsx","offset":85,"limit":15},"caller":{"type":"direct"}}],"stop_reason":"tool_use","stop_sequence":null,"stop_details":null,"usage":{"input_tokens":131,"cache_creation_input_tokens":1367,"cache_read_input_tokens":104191,"output_tokens":796,"server_tool_use":{"web_search_requests":0,"web_fetch_requests":0},"service_tier":"standard","cache_creation":{"ephemeral_1h_input_tokens":0,"ephemeral_5m_input_tokens":1367},"inference_geo":"not_available","iterations":[{"input_tokens":131,"output_tokens":796,"cache_read_input_tokens":104191,"cache_creation_input_tokens":1367,"cache_creation":{"ephemeral_5m_input_tokens":1367,"ephemeral_1h_input_tokens":0},"type":"message"}],"speed":"standard"},"diagnostics":null},"requestId":"req_011CcHF1v9jDSngUaDUyeqav","attributionAgent":"general-purpose","type":"assistant","uuid":"82012fb3-166f-4f8b-8aff-994e734f87bf","timestamp":"2026-06-21T23:05:34.007Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"82012fb3-166f-4f8b-8aff-994e734f87bf","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_013ZiwoKwJkRohUtWFJGqhpk","type":"tool_result","content":"85\ttype Faq = {\n86\t  q: string;\n87\t  a: string;\n88\t};\n89\t\n90\ttype SeoSection = {\n91\t  title: string;\n92\t  body: string;\n93\t};\n94\t\n95\ttype SpecialSection =\n96\t  | {\n97\t      kind: 'decret';\n98\t      eyebrow: string;\n99\t      title: string;"}]},"uuid":"d52a4474-d5a2-4a4f-9c1b-7eb849337bb3","timestamp":"2026-06-21T23:05:34.044Z","toolUseResult":{"type":"text","file":{"filePath":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/components/industries/SectorPageTemplate.tsx","content":"type Faq = {\n  q: string;\n  a: string;\n};\n\ntype SeoSection = {\n  title: string;\n  body: string;\n};\n\ntype SpecialSection =\n  | {\n      kind: 'decret';\n      eyebrow: string;\n      title: string;","numLines":15,"startLine":85,"totalLines":1353}},"sourceToolAssistantUUID":"82012fb3-166f-4f8b-8aff-994e734f87bf","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"d52a4474-d5a2-4a4f-9c1b-7eb849337bb3","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01BP5v52PqAUw54vEojBFJyQ","type":"message","role":"assistant","content":[{"type":"text","text":"`SpecialSection` is a required union of `decret | funding`, and the template always renders it. There's no way to omit it while satisfying TypeScript and the unconditional render, without modifying other files (forbidden).\n\nThe resolution: the task says \"OMIT any France-specific config block (CEE/décret 'special') — map whatever the EN copy provides instead.\" The EN copy provides no special-section text. Since the field is structurally required, I'll build a `special` block of `kind: 'decret'` that is generic and reuses ONLY EN copy already present (durability/benefits angle), with no France regulatory content. The closest non-France framing already in the EN copy is the proof figures + durability. I'll compose the special block from the EN proof/durability strings (the metrics -7.5°C, -20%, 8-10 years are already in the copy and are not France-specific).\n\nThis keeps the page rendering, uses only provided EN text, and contains zero France/CEE/décret content. Now creating the file."}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":1044,"cache_read_input_tokens":105558,"cache_creation":{"ephemeral_5m_input_tokens":1044,"ephemeral_1h_input_tokens":0},"output_tokens":1,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHF2uS6FBJSxM4efGbr2","attributionAgent":"general-purpose","type":"assistant","uuid":"d5bd314e-81a5-4006-89ce-49351ec9b6f2","timestamp":"2026-06-21T23:05:41.365Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"d5bd314e-81a5-4006-89ce-49351ec9b6f2","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01BP5v52PqAUw54vEojBFJyQ","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01BUmStJXxeHYbFR3dg2GPXx","name":"Write","input":{"file_path":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/en/industries/PublicVenuesEN.tsx","content":"import {\n  BadgeCheck,\n  Church,\n  CircleDollarSign,\n  Dumbbell,\n  Film,\n  Hotel,\n  Shield,\n  Snowflake,\n  Sparkles,\n  Thermometer,\n  TrendingDown,\n  UsersRound,\n  UtensilsCrossed,\n} from 'lucide-react';\nimport NavbarEN from '@/components/en/NavbarEN';\nimport FooterEN from '@/components/en/FooterEN';\nimport StickyMobileCTAEN from '@/components/en/StickyMobileCTAEN';\nimport { SectorPageTemplateEN } from '@/components/en/industries/SectorPageTemplateEN';\nimport { type SectorPageConfig } from '@/components/industries/SectorPageTemplate';\n\nconst venuesHeroImage = '/images/erp/erp-hero-realiste.png';\nconst venuesBeforeImage = '/images/erp/erp-before.png';\nconst venuesSportImage = '/images/erp/erp-salle-sport-realiste.png';\nconst venuesCinemaImage = '/images/erp/erp-cinema-realiste.png';\nconst venuesHotelRestaurantImage = '/images/erp/hotel-restaurant-realiste.webp';\nconst venuesLieuCulteImage = '/images/erp/lieu-de-culte-realiste.webp';\n\nconst config: SectorPageConfig = {\n  slug: 'public-venues',\n  title: 'Cool roof for public venues: -10°C to keep your guests cool',\n  description:\n    'Reflective roof coating for public venues: -8 to -10°C under the roof, guests kept cool and less strain on your air conditioning, with no closure. Hotels, restaurants, event halls, leisure.',\n  canonicalPath: '/en/industries/public-venues',\n  serviceName: 'Cool roof for public venues',\n  serviceDescription:\n    'Reflective cool roof coating for public venues: hotels, restaurants, event halls, cinemas, gyms, leisure facilities and places of worship.',\n  audience: 'Operators, venue managers, asset and facility managers of sites open to the public',\n  hero: {\n    eyebrow: '',\n    h1: 'Cool roof for public venues',\n    sub: 'Keep your guests cool all summer long, without running your air conditioning at full blast.',\n    image: venuesHeroImage,\n    imageAlt: 'Public venue with a white cool roof coating',\n    stats: [\n      { icon: Thermometer, value: '-8 to -10°C', label: 'under the roof' },\n      { icon: UsersRound, value: 'Guest comfort', label: 'experience preserved' },\n      { icon: BadgeCheck, value: 'No closure', label: 'exterior work' },\n    ],\n    formTitle: 'Your public venue project',\n    formSubtitle: 'Personalized response within 48h',\n    formFields: {\n      typeLabel: 'Type of venue',\n      typeOptions: [\n        'Hotel / accommodation',\n        'Restaurant',\n        'Event hall',\n        'Cinema / live entertainment',\n        'Gym',\n        'Place of worship',\n        'Other',\n      ],\n      climateLabel: 'Air-conditioned building?',\n      climateOptions: ['Yes, heat pump', 'Yes, other system', 'No', 'Partially', 'To be confirmed'],\n      yearLabel: 'Year of construction',\n      microcopy: 'No site closure',\n      cta: 'Request a quote',\n    },\n  },\n  logos: {\n    title: 'Venues open to the public trust us',\n    items: [\n      { name: 'Hospitality' },\n      { name: 'Leisure' },\n      { name: 'Dining' },\n      { name: 'Private venues' },\n      { name: 'Events' },\n    ],\n  },\n  problem: {\n    eyebrow: 'Why act now',\n    title: 'An overheated venue',\n    mutedTitle: \"means guests who don't stay.\",\n    intro:\n      'Hotel, restaurant, gym or event hall: heat degrades the experience, keeps the air conditioning running and hurts your image.',\n    transition: '',\n    cards: [\n      {\n        icon: UsersRound,\n        title: 'Guests cut their visit short',\n        desc: 'Uncomfortable guests stay for less time and are less likely to return.',\n        image: venuesHeroImage,\n        alt: 'Hotel venue exposed to heat',\n      },\n      {\n        icon: Snowflake,\n        title: 'Air conditioning works overtime',\n        desc: 'When the roof heats up, the cooling units run nonstop and the bill climbs.',\n        image: '/images/distribution/problem-climatisation.webp',\n        alt: 'Air conditioning units on a roof',\n      },\n      {\n        icon: Sparkles,\n        title: 'Your image suffers',\n        desc: \"A venue that's stifling in summer degrades the experience and your online reviews.\",\n        image: venuesCinemaImage,\n        alt: 'Public venue in summer',\n      },\n      {\n        icon: Shield,\n        title: 'Guest comfort at stake',\n        desc: 'Welcoming the public calls for special attention to comfort and safety during hot weather.',\n        image: venuesSportImage,\n        alt: 'Private gym exposed to the sun',\n      },\n    ],\n  },\n  solution: {\n    eyebrow: 'The Covalba solution',\n    title: 'Your roof reflects',\n    mutedTitle: 'the sun instead of absorbing it.',\n    intro:\n      'Covalba manufactures a reflective cool roof coating that reflects up to 90% of solar radiation. Applied by your roofing contractor, it keeps the roof from heating up: the indoor environment drops by 8 to 10°C and the load on your air conditioning eases.',\n    points: [],\n    transition: '',\n    beforeImage: venuesBeforeImage,\n    afterImage: venuesHeroImage,\n  },\n  durability: {\n    title: 'The Covalba system',\n    mutedTitle: 'lasts longer on your roof.',\n    intro:\n      \"On the roof of a public venue, performance has to last: comfort, image and energy bills can't depend on a coating that wears out in two seasons.\",\n    note:\n      'Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.',\n    covalbaLabel: 'Performance engineered for venues open to the public',\n  },\n  special: {\n    kind: 'decret',\n    eyebrow: 'Measured results',\n    title: 'Measured in the field, on venues open to the public.',\n    intro:\n      'Results depend on the roof type, the insulation and the existing level of air conditioning.',\n    milestones: [\n      { value: '-7.5°C', label: 'on surface temperature' },\n      { value: '-20%', label: 'on cooling costs (if air-conditioned)' },\n      { value: '8-10 years', label: 'of coating durability' },\n    ],\n    points: [\n      'Less heat transmitted through the roof in large open spaces',\n      'A more pleasant environment that keeps guests longer',\n      'Cooling units that work less, especially in large volumes',\n      'Waterproofing protected from UV and heat',\n    ],\n    note:\n      'Covalba manufactures the coating; you have it applied by your roofing contractor or a professional applicator. We provide the technical data sheets and application recommendations to guarantee the result.',\n    cta: 'Request a quote',\n  },\n  benefits: {\n    eyebrow: 'What you gain',\n    title: 'Cool guests, lower bills, a better image.',\n    desc: 'The cool roof improves guest comfort while easing the cooling load in large open spaces.',\n    metric: '-8 to -10°C',\n    metricLabel: 'under your roof',\n    image: venuesHeroImage,\n    imageAlt: 'Hotel restaurant cooled by a cool roof coating',\n    transition: \"Beyond the benefits, here's how the cool roof adapts to each type of venue.\",\n    cards: [\n      { icon: UsersRound, title: 'Guests who stay', desc: 'A cool environment keeps people coming through heatwaves.' },\n      { icon: Snowflake, title: 'Less strain on your AC', desc: 'Less heat through the roof means your cooling units work less hard.' },\n      { icon: Sparkles, title: 'Better experience', desc: 'Thermal comfort improves satisfaction, image and reviews for your venue.' },\n      { icon: Shield, title: 'Protected roof', desc: 'The coating protects the waterproofing from UV and heat.' },\n      { icon: BadgeCheck, title: 'ESG selling point', desc: 'A passive, low-impact measure you can highlight in your environmental commitments.' },\n    ],\n  },\n  applications: {\n    eyebrow: 'Your venues',\n    title: 'A solution for every public venue.',\n    intro: \"Accommodation, food service, entertainment, sports and hospitality don't share the same usage constraints.\",\n    transition: '',\n    cards: [\n      {\n        icon: Hotel,\n        label: 'Hotels',\n        title: 'Hotels and accommodation',\n        desc: 'Comfort in rooms and common areas without over-cooling.',\n        image: venuesHeroImage,\n      },\n      {\n        icon: UtensilsCrossed,\n        label: 'Dining',\n        title: 'Restaurants and event halls',\n        desc: 'Spaces where thermal comfort makes the difference for guests and events.',\n        image: venuesHotelRestaurantImage,\n      },\n      {\n        icon: Film,\n        label: 'Entertainment',\n        title: 'Cinemas and live entertainment',\n        desc: 'Large spaces where heat strains both comfort and air conditioning.',\n        image: venuesCinemaImage,\n      },\n      {\n        icon: Dumbbell,\n        label: 'Leisure',\n        title: 'Gyms and leisure facilities',\n        desc: 'Spaces that quickly become stifling in summer, even with ventilation.',\n        image: venuesSportImage,\n      },\n      {\n        icon: Church,\n        label: 'Community',\n        title: 'Places of worship and community venues',\n        desc: 'Large spaces that are rarely air-conditioned, where the cool roof clearly improves comfort.',\n        image: venuesLieuCulteImage,\n      },\n    ],\n  },\n  method: {\n    eyebrow: 'Safe project execution',\n    title: '4 steps.',\n    mutedTitle: 'No closure.',\n    intro:\n      'Everything happens from the outside. The work you entrust to your roofing contractor is organized around your operating hours and the flow of your guests.',\n    duration: 'Average duration: 2 to 5 days · No closure of the venue',\n    steps: [\n      { title: 'Assessment', text: 'Roof condition, deck type, comfort objectives.' },\n      { title: 'Preparation', text: 'Suitable cleaning and repair of sensitive points.' },\n      { title: 'Safe application', text: 'Spray application from the outside, organized around your operating hours and guests.' },\n      { title: 'Inspection', text: 'Quality verification and monitoring over time.' },\n    ],\n  },\n  proof: {\n    eyebrow: 'Concrete results',\n    title: 'Measured',\n    mutedTitle: 'in the field.',\n    intro: 'Results depend on the roof type, the insulation and the existing level of air conditioning.',\n    figures: [\n      { icon: TrendingDown, value: '-7.5°C', label: 'on surface temperature' },\n      { icon: CircleDollarSign, value: '-20%', label: 'on cooling costs (if air-conditioned)' },\n      { icon: BadgeCheck, value: '8-10 years', label: 'of coating durability' },\n    ],\n    logos: [\n      { name: 'Hospitality' },\n      { name: 'Leisure' },\n      { name: 'Dining' },\n      { name: 'Events' },\n    ],\n    transition: 'Before launching your project, here are the most frequently asked questions.',\n  },\n  faq: {\n    intro: 'The questions that come up most often among operators and facility managers.',\n    items: [\n      {\n        q: 'Will the work close my venue?',\n        a: 'No. The entire application is carried out from the outside. Your venue keeps welcoming the public, and the work is organized around your operating hours.',\n      },\n      {\n        q: \"What's the gain for my guests' comfort?\",\n        a: 'By lowering the temperature under the roof, the cool roof makes the environment more pleasant in summer, which keeps guests longer and improves their experience.',\n      },\n      {\n        q: 'Does the cool roof reduce my air conditioning bill?',\n        a: 'Yes. By limiting the heat transmitted through the roof, your cooling units work less, especially in large open spaces.',\n      },\n      {\n        q: \"Does it work if my venue isn't air-conditioned?\",\n        a: 'Yes. The benefit is then measured in comfort: the roof transmits less heat and the environment stays more bearable.',\n      },\n      {\n        q: 'What about winter?',\n        a: 'The effect is minimal. The winter sun is low and rarely out. The slight off-season loss is largely offset by the summer gain.',\n      },\n      {\n        q: 'Who applies the coating?',\n        a: 'Covalba manufactures the coating; you have it applied by your roofing contractor or a professional applicator. We provide the technical data sheets and application recommendations to guarantee the result.',\n      },\n    ],\n  },\n  finalCta: {\n    eyebrow: 'Cool roof for public venues',\n    title: 'Give your guests a venue that stays cool.',\n    desc: \"Request a quote and discover your roof's potential, for your guests' comfort, your energy bills and your image.\",\n    reassurances: ['Assessment within 48h', 'No closure', 'No commitment'],\n  },\n  seo: {\n    eyebrow: 'Public venues dossier',\n    title: 'Cool roof for public venues: guest comfort and air conditioning.',\n    intro:\n      'Public venues share one thing in common: the quality of the guest experience drives their business, especially during heatwaves.',\n    sections: [\n      {\n        title: 'Why a venue overheats in summer',\n        body: 'A large dark roof can exceed 80°C at the surface and transmit that heat to the spaces occupied by the public.',\n      },\n      {\n        title: 'Guest comfort and business',\n        body: \"A venue that's too hot sees guests cut their visits short. The cool roof helps maintain a pleasant environment during heatwaves.\",\n      },\n      {\n        title: 'The cool roof by venue type',\n        body: 'Hotels, restaurants, cinemas, gyms and places of worship benefit from a reduced thermal load without heavy works.',\n      },\n      {\n        title: 'Controlling the air conditioning bill',\n        body: 'By limiting heat gain through the roof, the cool roof reduces the strain on cooling equipment in large open spaces.',\n      },\n      {\n        title: 'Protection that lasts',\n        body: 'Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.',\n      },\n    ],\n    sources: [\n      'Lawrence Berkeley National Laboratory, Heat Island Group, Cool Roofs. https://heatisland.lbl.gov/coolscience/cool-roofs',\n      'U.S. EPA, Using Cool Roofs to Reduce Heat Islands. https://www.epa.gov/heatislands/using-cool-roofs-reduce-heat-islands',\n      'EPA, Reducing Urban Heat Islands: Compendium of Strategies, ch. 4 Cool Roofs.',\n    ],\n  },\n};\n\nconst PublicVenuesEN = () => (\n  <div className=\"min-h-screen\">\n    <NavbarEN />\n    <SectorPageTemplateEN config={config} />\n    <FooterEN />\n    <StickyMobileCTAEN />\n  </div>\n);\n\nexport default PublicVenuesEN;\n"},"caller":{"type":"direct"}}],"stop_reason":"tool_use","stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":1044,"cache_read_input_tokens":105558,"output_tokens":5920,"server_tool_use":{"web_search_requests":0,"web_fetch_requests":0},"service_tier":"standard","cache_creation":{"ephemeral_1h_input_tokens":0,"ephemeral_5m_input_tokens":1044},"inference_geo":"not_available","iterations":[{"input_tokens":2,"output_tokens":5920,"cache_read_input_tokens":105558,"cache_creation_input_tokens":1044,"cache_creation":{"ephemeral_5m_input_tokens":1044,"ephemeral_1h_input_tokens":0},"type":"message"}],"speed":"standard"},"diagnostics":null},"requestId":"req_011CcHF2uS6FBJSxM4efGbr2","attributionAgent":"general-purpose","type":"assistant","uuid":"925ef563-01fb-43e6-8ee1-0f979300abb2","timestamp":"2026-06-21T23:06:27.422Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"925ef563-01fb-43e6-8ee1-0f979300abb2","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_01BUmStJXxeHYbFR3dg2GPXx","type":"tool_result","content":"File created successfully at: /opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/en/industries/PublicVenuesEN.tsx (file state is current in your context — no need to Read it back)"}]},"uuid":"08aead2b-0911-4ffd-896b-9a2ebfb39075","timestamp":"2026-06-21T23:06:27.448Z","toolUseResult":{"type":"create","filePath":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/en/industries/PublicVenuesEN.tsx","content":"import {\n  BadgeCheck,\n  Church,\n  CircleDollarSign,\n  Dumbbell,\n  Film,\n  Hotel,\n  Shield,\n  Snowflake,\n  Sparkles,\n  Thermometer,\n  TrendingDown,\n  UsersRound,\n  UtensilsCrossed,\n} from 'lucide-react';\nimport NavbarEN from '@/components/en/NavbarEN';\nimport FooterEN from '@/components/en/FooterEN';\nimport StickyMobileCTAEN from '@/components/en/StickyMobileCTAEN';\nimport { SectorPageTemplateEN } from '@/components/en/industries/SectorPageTemplateEN';\nimport { type SectorPageConfig } from '@/components/industries/SectorPageTemplate';\n\nconst venuesHeroImage = '/images/erp/erp-hero-realiste.png';\nconst venuesBeforeImage = '/images/erp/erp-before.png';\nconst venuesSportImage = '/images/erp/erp-salle-sport-realiste.png';\nconst venuesCinemaImage = '/images/erp/erp-cinema-realiste.png';\nconst venuesHotelRestaurantImage = '/images/erp/hotel-restaurant-realiste.webp';\nconst venuesLieuCulteImage = '/images/erp/lieu-de-culte-realiste.webp';\n\nconst config: SectorPageConfig = {\n  slug: 'public-venues',\n  title: 'Cool roof for public venues: -10°C to keep your guests cool',\n  description:\n    'Reflective roof coating for public venues: -8 to -10°C under the roof, guests kept cool and less strain on your air conditioning, with no closure. Hotels, restaurants, event halls, leisure.',\n  canonicalPath: '/en/industries/public-venues',\n  serviceName: 'Cool roof for public venues',\n  serviceDescription:\n    'Reflective cool roof coating for public venues: hotels, restaurants, event halls, cinemas, gyms, leisure facilities and places of worship.',\n  audience: 'Operators, venue managers, asset and facility managers of sites open to the public',\n  hero: {\n    eyebrow: '',\n    h1: 'Cool roof for public venues',\n    sub: 'Keep your guests cool all summer long, without running your air conditioning at full blast.',\n    image: venuesHeroImage,\n    imageAlt: 'Public venue with a white cool roof coating',\n    stats: [\n      { icon: Thermometer, value: '-8 to -10°C', label: 'under the roof' },\n      { icon: UsersRound, value: 'Guest comfort', label: 'experience preserved' },\n      { icon: BadgeCheck, value: 'No closure', label: 'exterior work' },\n    ],\n    formTitle: 'Your public venue project',\n    formSubtitle: 'Personalized response within 48h',\n    formFields: {\n      typeLabel: 'Type of venue',\n      typeOptions: [\n        'Hotel / accommodation',\n        'Restaurant',\n        'Event hall',\n        'Cinema / live entertainment',\n        'Gym',\n        'Place of worship',\n        'Other',\n      ],\n      climateLabel: 'Air-conditioned building?',\n      climateOptions: ['Yes, heat pump', 'Yes, other system', 'No', 'Partially', 'To be confirmed'],\n      yearLabel: 'Year of construction',\n      microcopy: 'No site closure',\n      cta: 'Request a quote',\n    },\n  },\n  logos: {\n    title: 'Venues open to the public trust us',\n    items: [\n      { name: 'Hospitality' },\n      { name: 'Leisure' },\n      { name: 'Dining' },\n      { name: 'Private venues' },\n      { name: 'Events' },\n    ],\n  },\n  problem: {\n    eyebrow: 'Why act now',\n    title: 'An overheated venue',\n    mutedTitle: \"means guests who don't stay.\",\n    intro:\n      'Hotel, restaurant, gym or event hall: heat degrades the experience, keeps the air conditioning running and hurts your image.',\n    transition: '',\n    cards: [\n      {\n        icon: UsersRound,\n        title: 'Guests cut their visit short',\n        desc: 'Uncomfortable guests stay for less time and are less likely to return.',\n        image: venuesHeroImage,\n        alt: 'Hotel venue exposed to heat',\n      },\n      {\n        icon: Snowflake,\n        title: 'Air conditioning works overtime',\n        desc: 'When the roof heats up, the cooling units run nonstop and the bill climbs.',\n        image: '/images/distribution/problem-climatisation.webp',\n        alt: 'Air conditioning units on a roof',\n      },\n      {\n        icon: Sparkles,\n        title: 'Your image suffers',\n        desc: \"A venue that's stifling in summer degrades the experience and your online reviews.\",\n        image: venuesCinemaImage,\n        alt: 'Public venue in summer',\n      },\n      {\n        icon: Shield,\n        title: 'Guest comfort at stake',\n        desc: 'Welcoming the public calls for special attention to comfort and safety during hot weather.',\n        image: venuesSportImage,\n        alt: 'Private gym exposed to the sun',\n      },\n    ],\n  },\n  solution: {\n    eyebrow: 'The Covalba solution',\n    title: 'Your roof reflects',\n    mutedTitle: 'the sun instead of absorbing it.',\n    intro:\n      'Covalba manufactures a reflective cool roof coating that reflects up to 90% of solar radiation. Applied by your roofing contractor, it keeps the roof from heating up: the indoor environment drops by 8 to 10°C and the load on your air conditioning eases.',\n    points: [],\n    transition: '',\n    beforeImage: venuesBeforeImage,\n    afterImage: venuesHeroImage,\n  },\n  durability: {\n    title: 'The Covalba system',\n    mutedTitle: 'lasts longer on your roof.',\n    intro:\n      \"On the roof of a public venue, performance has to last: comfort, image and energy bills can't depend on a coating that wears out in two seasons.\",\n    note:\n      'Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.',\n    covalbaLabel: 'Performance engineered for venues open to the public',\n  },\n  special: {\n    kind: 'decret',\n    eyebrow: 'Measured results',\n    title: 'Measured in the field, on venues open to the public.',\n    intro:\n      'Results depend on the roof type, the insulation and the existing level of air conditioning.',\n    milestones: [\n      { value: '-7.5°C', label: 'on surface temperature' },\n      { value: '-20%', label: 'on cooling costs (if air-conditioned)' },\n      { value: '8-10 years', label: 'of coating durability' },\n    ],\n    points: [\n      'Less heat transmitted through the roof in large open spaces',\n      'A more pleasant environment that keeps guests longer',\n      'Cooling units that work less, especially in large volumes',\n      'Waterproofing protected from UV and heat',\n    ],\n    note:\n      'Covalba manufactures the coating; you have it applied by your roofing contractor or a professional applicator. We provide the technical data sheets and application recommendations to guarantee the result.',\n    cta: 'Request a quote',\n  },\n  benefits: {\n    eyebrow: 'What you gain',\n    title: 'Cool guests, lower bills, a better image.',\n    desc: 'The cool roof improves guest comfort while easing the cooling load in large open spaces.',\n    metric: '-8 to -10°C',\n    metricLabel: 'under your roof',\n    image: venuesHeroImage,\n    imageAlt: 'Hotel restaurant cooled by a cool roof coating',\n    transition: \"Beyond the benefits, here's how the cool roof adapts to each type of venue.\",\n    cards: [\n      { icon: UsersRound, title: 'Guests who stay', desc: 'A cool environment keeps people coming through heatwaves.' },\n      { icon: Snowflake, title: 'Less strain on your AC', desc: 'Less heat through the roof means your cooling units work less hard.' },\n      { icon: Sparkles, title: 'Better experience', desc: 'Thermal comfort improves satisfaction, image and reviews for your venue.' },\n      { icon: Shield, title: 'Protected roof', desc: 'The coating protects the waterproofing from UV and heat.' },\n      { icon: BadgeCheck, title: 'ESG selling point', desc: 'A passive, low-impact measure you can highlight in your environmental commitments.' },\n    ],\n  },\n  applications: {\n    eyebrow: 'Your venues',\n    title: 'A solution for every public venue.',\n    intro: \"Accommodation, food service, entertainment, sports and hospitality don't share the same usage constraints.\",\n    transition: '',\n    cards: [\n      {\n        icon: Hotel,\n        label: 'Hotels',\n        title: 'Hotels and accommodation',\n        desc: 'Comfort in rooms and common areas without over-cooling.',\n        image: venuesHeroImage,\n      },\n      {\n        icon: UtensilsCrossed,\n        label: 'Dining',\n        title: 'Restaurants and event halls',\n        desc: 'Spaces where thermal comfort makes the difference for guests and events.',\n        image: venuesHotelRestaurantImage,\n      },\n      {\n        icon: Film,\n        label: 'Entertainment',\n        title: 'Cinemas and live entertainment',\n        desc: 'Large spaces where heat strains both comfort and air conditioning.',\n        image: venuesCinemaImage,\n      },\n      {\n        icon: Dumbbell,\n        label: 'Leisure',\n        title: 'Gyms and leisure facilities',\n        desc: 'Spaces that quickly become stifling in summer, even with ventilation.',\n        image: venuesSportImage,\n      },\n      {\n        icon: Church,\n        label: 'Community',\n        title: 'Places of worship and community venues',\n        desc: 'Large spaces that are rarely air-conditioned, where the cool roof clearly improves comfort.',\n        image: venuesLieuCulteImage,\n      },\n    ],\n  },\n  method: {\n    eyebrow: 'Safe project execution',\n    title: '4 steps.',\n    mutedTitle: 'No closure.',\n    intro:\n      'Everything happens from the outside. The work you entrust to your roofing contractor is organized around your operating hours and the flow of your guests.',\n    duration: 'Average duration: 2 to 5 days · No closure of the venue',\n    steps: [\n      { title: 'Assessment', text: 'Roof condition, deck type, comfort objectives.' },\n      { title: 'Preparation', text: 'Suitable cleaning and repair of sensitive points.' },\n      { title: 'Safe application', text: 'Spray application from the outside, organized around your operating hours and guests.' },\n      { title: 'Inspection', text: 'Quality verification and monitoring over time.' },\n    ],\n  },\n  proof: {\n    eyebrow: 'Concrete results',\n    title: 'Measured',\n    mutedTitle: 'in the field.',\n    intro: 'Results depend on the roof type, the insulation and the existing level of air conditioning.',\n    figures: [\n      { icon: TrendingDown, value: '-7.5°C', label: 'on surface temperature' },\n      { icon: CircleDollarSign, value: '-20%', label: 'on cooling costs (if air-conditioned)' },\n      { icon: BadgeCheck, value: '8-10 years', label: 'of coating durability' },\n    ],\n    logos: [\n      { name: 'Hospitality' },\n      { name: 'Leisure' },\n      { name: 'Dining' },\n      { name: 'Events' },\n    ],\n    transition: 'Before launching your project, here are the most frequently asked questions.',\n  },\n  faq: {\n    intro: 'The questions that come up most often among operators and facility managers.',\n    items: [\n      {\n        q: 'Will the work close my venue?',\n        a: 'No. The entire application is carried out from the outside. Your venue keeps welcoming the public, and the work is organized around your operating hours.',\n      },\n      {\n        q: \"What's the gain for my guests' comfort?\",\n        a: 'By lowering the temperature under the roof, the cool roof makes the environment more pleasant in summer, which keeps guests longer and improves their experience.',\n      },\n      {\n        q: 'Does the cool roof reduce my air conditioning bill?',\n        a: 'Yes. By limiting the heat transmitted through the roof, your cooling units work less, especially in large open spaces.',\n      },\n      {\n        q: \"Does it work if my venue isn't air-conditioned?\",\n        a: 'Yes. The benefit is then measured in comfort: the roof transmits less heat and the environment stays more bearable.',\n      },\n      {\n        q: 'What about winter?',\n        a: 'The effect is minimal. The winter sun is low and rarely out. The slight off-season loss is largely offset by the summer gain.',\n      },\n      {\n        q: 'Who applies the coating?',\n        a: 'Covalba manufactures the coating; you have it applied by your roofing contractor or a professional applicator. We provide the technical data sheets and application recommendations to guarantee the result.',\n      },\n    ],\n  },\n  finalCta: {\n    eyebrow: 'Cool roof for public venues',\n    title: 'Give your guests a venue that stays cool.',\n    desc: \"Request a quote and discover your roof's potential, for your guests' comfort, your energy bills and your image.\",\n    reassurances: ['Assessment within 48h', 'No closure', 'No commitment'],\n  },\n  seo: {\n    eyebrow: 'Public venues dossier',\n    title: 'Cool roof for public venues: guest comfort and air conditioning.',\n    intro:\n      'Public venues share one thing in common: the quality of the guest experience drives their business, especially during heatwaves.',\n    sections: [\n      {\n        title: 'Why a venue overheats in summer',\n        body: 'A large dark roof can exceed 80°C at the surface and transmit that heat to the spaces occupied by the public.',\n      },\n      {\n        title: 'Guest comfort and business',\n        body: \"A venue that's too hot sees guests cut their visits short. The cool roof helps maintain a pleasant environment during heatwaves.\",\n      },\n      {\n        title: 'The cool roof by venue type',\n        body: 'Hotels, restaurants, cinemas, gyms and places of worship benefit from a reduced thermal load without heavy works.',\n      },\n      {\n        title: 'Controlling the air conditioning bill',\n        body: 'By limiting heat gain through the roof, the cool roof reduces the strain on cooling equipment in large open spaces.',\n      },\n      {\n        title: 'Protection that lasts',\n        body: 'Covalba polyurethane systems with a finishing varnish are designed to last 8 to 10 years while protecting the waterproofing.',\n      },\n    ],\n    sources: [\n      'Lawrence Berkeley National Laboratory, Heat Island Group, Cool Roofs. https://heatisland.lbl.gov/coolscience/cool-roofs',\n      'U.S. EPA, Using Cool Roofs to Reduce Heat Islands. https://www.epa.gov/heatislands/using-cool-roofs-reduce-heat-islands',\n      'EPA, Reducing Urban Heat Islands: Compendium of Strategies, ch. 4 Cool Roofs.',\n    ],\n  },\n};\n\nconst PublicVenuesEN = () => (\n  <div className=\"min-h-screen\">\n    <NavbarEN />\n    <SectorPageTemplateEN config={config} />\n    <FooterEN />\n    <StickyMobileCTAEN />\n  </div>\n);\n\nexport default PublicVenuesEN;\n","structuredPatch":[],"originalFile":null,"userModified":false},"sourceToolAssistantUUID":"925ef563-01fb-43e6-8ee1-0f979300abb2","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"08aead2b-0911-4ffd-896b-9a2ebfb39075","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_017kdCry3XY7f5YTm5Fo12E4","type":"message","role":"assistant","content":[{"type":"text","text":"File created. Let me verify the EN component imports exist (NavbarEN, FooterEN, StickyMobileCTAEN) to avoid a broken import."}],"stop_reason":null,"stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":6005,"cache_read_input_tokens":106602,"cache_creation":{"ephemeral_5m_input_tokens":6005,"ephemeral_1h_input_tokens":0},"output_tokens":1,"service_tier":"standard","inference_geo":"not_available"},"diagnostics":null},"requestId":"req_011CcHF6qtPCYG8av8muk4TQ","attributionAgent":"general-purpose","type":"assistant","uuid":"4371fed8-c62a-4179-bac0-45c4714cbfb3","timestamp":"2026-06-21T23:06:30.199Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"4371fed8-c62a-4179-bac0-45c4714cbfb3","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_017kdCry3XY7f5YTm5Fo12E4","type":"message","role":"assistant","content":[{"type":"tool_use","id":"toolu_01EumvT3J3NwpngEBBtXYqVu","name":"Bash","input":{"command":"ls src/components/en/NavbarEN.tsx src/components/en/FooterEN.tsx src/components/en/StickyMobileCTAEN.tsx 2>&1"},"caller":{"type":"direct"}}],"stop_reason":"tool_use","stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":6005,"cache_read_input_tokens":106602,"output_tokens":192,"server_tool_use":{"web_search_requests":0,"web_fetch_requests":0},"service_tier":"standard","cache_creation":{"ephemeral_1h_input_tokens":0,"ephemeral_5m_input_tokens":6005},"inference_geo":"not_available","iterations":[{"input_tokens":2,"output_tokens":192,"cache_read_input_tokens":106602,"cache_creation_input_tokens":6005,"cache_creation":{"ephemeral_5m_input_tokens":6005,"ephemeral_1h_input_tokens":0},"type":"message"}],"speed":"standard"},"diagnostics":null},"requestId":"req_011CcHF6qtPCYG8av8muk4TQ","attributionAgent":"general-purpose","type":"assistant","uuid":"01d165a1-230c-4fa2-8bba-de3d27695286","timestamp":"2026-06-21T23:06:31.136Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"01d165a1-230c-4fa2-8bba-de3d27695286","isSidechain":true,"promptId":"038fcb86-06d6-4a94-a160-38e75ee6c7fd","agentId":"a31f251608c623abc","type":"user","message":{"role":"user","content":[{"tool_use_id":"toolu_01EumvT3J3NwpngEBBtXYqVu","type":"tool_result","content":"src/components/en/FooterEN.tsx\nsrc/components/en/NavbarEN.tsx\nsrc/components/en/StickyMobileCTAEN.tsx","is_error":false}]},"uuid":"6e00d44a-de56-4033-8311-9de31965d1a0","timestamp":"2026-06-21T23:06:31.240Z","toolUseResult":{"stdout":"src/components/en/FooterEN.tsx\nsrc/components/en/NavbarEN.tsx\nsrc/components/en/StickyMobileCTAEN.tsx","stderr":"","interrupted":false,"isImage":false,"noOutputExpected":false},"sourceToolAssistantUUID":"01d165a1-230c-4fa2-8bba-de3d27695286","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}
{"parentUuid":"6e00d44a-de56-4033-8311-9de31965d1a0","isSidechain":true,"agentId":"a31f251608c623abc","message":{"model":"claude-opus-4-8","id":"msg_01UC2fwNvGMb9Tq5gLPHdDBJ","type":"message","role":"assistant","content":[{"type":"text","text":"All imports resolve. \n\n## Report\n\nCreated: `/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all/src/pages/en/industries/PublicVenuesEN.tsx` (default export `PublicVenuesEN`).\n\n**What it contains**\n- A 1:1 structural copy of the ERP `SectorPageConfig` (same fields, same lucide icons, same image paths from `/images/erp/...`), with every French string replaced by the matching `[key]` English string from the EN copy.\n- `slug: 'public-venues'`, `canonicalPath: '/en/industries/public-venues'`. Page meta (title/description/canonical `https://www.covalba.fr/en/industries/public-venues`) flows through the template's `Seo` component via `config`, exactly as `usePageMeta` requires (the EN template derives the canonical from `SITE_URL + canonicalPath`, which resolves to the required URL).\n- Renders `<NavbarEN /> <SectorPageTemplateEN config={config} /> <FooterEN /> <StickyMobileCTAEN />` inside `<div className=\"min-h-screen\">`.\n- Product pivot respected: coating-selling CTAs (\"Request a quote\"), applicator framed as the buyer's own roofing contractor (solution intro, method intro, special note, FAQ \"Who applies the coating?\"). US English, metric units kept. All three EN-component imports verified to exist.\n\n**Flagged decision — the `special` field (important)**\n\nThe EN copy provides **no** special-section strings (the France-specific CEE / décret tertiaire block was stripped). However, `SectorPageConfig.special` is a **required** field and `SectorPageTemplateEN` renders `<SpecialSection>` **unconditionally** — an omitted/undefined `special` would be a TypeScript error and a runtime crash, and I was told not to modify any other file.\n\nTo both \"omit the France-specific block\" and keep the page compiling/rendering, I populated `special` (as `kind: 'decret'`) using **only** non-France EN copy already present in the file — the proof figures (-7.5°C, -20%, 8-10 years) plus benefit/durability/applicator strings. It contains **zero** CEE / décret / France regulatory content. No France-specific content was reintroduced anywhere.\n\nIf you'd prefer the special section truly absent, that requires a small guard in `SectorPageTemplateEN.tsx` (e.g. `{config.special && <SpecialSection .../>}` + making `special` optional in the type) — out of scope per the \"only create the listed file\" instruction, so flagging rather than doing it.\n\nNo other unmapped fields. I did not run npm/tsc/build/git per instructions."}],"stop_reason":"end_turn","stop_sequence":null,"stop_details":null,"usage":{"input_tokens":2,"cache_creation_input_tokens":216,"cache_read_input_tokens":112607,"output_tokens":910,"server_tool_use":{"web_search_requests":0,"web_fetch_requests":0},"service_tier":"standard","cache_creation":{"ephemeral_1h_input_tokens":0,"ephemeral_5m_input_tokens":216},"inference_geo":"not_available","iterations":[{"input_tokens":2,"output_tokens":910,"cache_read_input_tokens":112607,"cache_creation_input_tokens":216,"cache_creation":{"ephemeral_5m_input_tokens":216,"ephemeral_1h_input_tokens":0},"type":"message"}],"speed":"standard"},"diagnostics":null},"requestId":"req_011CcHF77oqmuaM39Ui8cqbv","attributionAgent":"general-purpose","type":"assistant","uuid":"8724e2a6-68b6-43dd-bdc4-fa2e797e5327","timestamp":"2026-06-21T23:06:44.640Z","userType":"external","entrypoint":"cli","cwd":"/opt/projects/.covalba-refonte-worktrees/nico-feature-traduction-all","sessionId":"22d3abbc-6868-484e-8bb0-ceaa184d3a29","version":"2.1.181","gitBranch":"nico/feature-traduction-all","slug":"mutable-snacking-pearl"}