{"id":8,"date":"2026-06-15T16:53:45","date_gmt":"2026-06-15T16:53:45","guid":{"rendered":"https:\/\/novo.mosal.com.br\/?page_id=8"},"modified":"2026-10-06T13:54:19","modified_gmt":"2026-10-06T13:54:19","slug":"home","status":"publish","type":"page","link":"https:\/\/novo.mosal.com.br\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b77d1e4 e-con-full e-flex e-con e-parent\" data-id=\"b77d1e4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-18adc994 elementor-widget elementor-widget-html\" data-id=\"18adc994\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  MOSAL | HERO DA HOME MODERNA\n  COMO USAR NO ELEMENTOR:\n  1. Adicione um widget HTML.\n  2. Cole este arquivo inteiro no widget.\n  3. Troque somente os conte\u00fados identificados pelos IDs.\n  4. O tubo 3D \u00e9 gerado pelo script no fim do widget (Three.js). Textos das cotas e velocidade do giro (GIRO_POR_PIXEL) ficam no in\u00edcio do script.\n-->\n\n<style>\n  \/* ===== HERO MOSAL: VARI\u00c1VEIS F\u00c1CEIS DE ALTERAR ===== *\/\n  #mosal-hero-home {\n    --mosal-hero-azul: #0878f9;\n    --mosal-hero-azul-escuro: #01172c;\n    --mosal-hero-azul-medio: #043b6e;\n    --mosal-hero-branco: #ffffff;\n    --mosal-hero-texto: #d2deea;\n    position: relative;\n    min-height: 790px;\n    overflow: hidden;\n    color: var(--mosal-hero-branco);\n    background:\n      radial-gradient(circle at 72% 50%, #0864b9 0%, var(--mosal-hero-azul-medio) 25%, #021f3b 56%, var(--mosal-hero-azul-escuro) 100%);\n    font-family: Arial, Helvetica, sans-serif;\n    isolation: isolate;\n  }\n\n  #mosal-hero-home,\n  #mosal-hero-home * {\n    box-sizing: border-box;\n  }\n\n  \/* Grade t\u00e9cnica de fundo *\/\n  #mosal-hero-grade {\n    position: absolute;\n    inset: 0;\n    z-index: -3;\n    background-image:\n      linear-gradient(rgba(255,255,255,0) 0 95%, rgba(121,185,239,.07) 95%),\n      linear-gradient(90deg, rgba(255,255,255,0) 0 95%, rgba(121,185,239,.06) 95%);\n    background-size: 70px 70px;\n    -webkit-mask-image: linear-gradient(100deg, transparent 5%, #000 46%, #000 100%);\n    mask-image: linear-gradient(100deg, transparent 5%, #000 46%, #000 100%);\n  }\n\n  \/* S\u00edmbolo da marca Mosal como marca-d'\u00e1gua (transparente, atr\u00e1s do desenho) *\/\n  #mosal-hero-letra-m {\n    position: absolute;\n    z-index: -2;\n    left: 47%;\n    top: 50%;\n    width: clamp(420px, 46vw, 820px);\n    margin: 0;\n    opacity: .16;\n    transform: translateY(-50%);\n    pointer-events: none;\n    user-select: none;\n  }\n\n  #mosal-hero-letra-m svg {\n    display: block;\n    width: 100%;\n    height: auto;\n  }\n\n  #mosal-hero-conteudo {\n    position: relative;\n    z-index: 1;\n    width: min(1440px, 100%);\n    min-height: 790px;\n    margin: 0 auto;\n    padding: 95px clamp(28px, 6vw, 100px) 52px;\n    display: grid;\n    grid-template-columns: minmax(0, .9fr) minmax(440px, 1.1fr);\n    gap: clamp(30px, 4vw, 72px);\n    align-items: center;\n  }\n\n  #mosal-hero-textos {\n    position: relative;\n    z-index: 2;\n  }\n\n  #mosal-hero-etiqueta {\n    margin: 0 0 22px;\n    color: #9acbff;\n    font-size: 12px;\n    font-weight: 800;\n    line-height: 1.4;\n    letter-spacing: .32em;\n    text-transform: uppercase;\n  }\n\n  #mosal-hero-titulo {\n    max-width: 690px;\n    margin: 0;\n    color: var(--mosal-hero-branco);\n    font-size: clamp(46px, 5vw, 80px);\n    overflow-wrap: break-word;\n    font-weight: 800;\n    line-height: .9;\n    letter-spacing: -.065em;\n  }\n\n  #mosal-hero-texto {\n    max-width: 570px;\n    margin: 28px 0 34px;\n    color: var(--mosal-hero-texto);\n    font-size: 17px;\n    line-height: 1.65;\n  }\n\n  #mosal-hero-botao {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 15px;\n    padding: 17px 24px;\n    border-radius: 999px;\n    background: #ffffff;\n    color: #03294c;\n    box-shadow: 0 14px 34px rgba(0,20,38,.32);\n    font-size: 13px;\n    font-weight: 800;\n    line-height: 1;\n    text-decoration: none;\n    transition: transform .2s ease, box-shadow .2s ease;\n  }\n\n  #mosal-hero-botao:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 18px 40px rgba(0,20,38,.45);\n  }\n\n  #mosal-hero-beneficios {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 20px;\n    margin-top: 64px;\n    padding-top: 28px;\n    border-top: 1px solid rgba(169,211,245,.18);\n  }\n\n  .mosal-hero-beneficio {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    min-width: 0;\n  }\n\n  .mosal-hero-beneficio-icone {\n    width: 38px;\n    height: 38px;\n    flex: 0 0 38px;\n    display: grid;\n    place-items: center;\n    border: 1px solid #3aa0ff;\n    border-radius: 50%;\n    color: #6db8ff;\n    font-size: 10px;\n    font-weight: 800;\n  }\n\n  .mosal-hero-beneficio-titulo,\n  .mosal-hero-beneficio-texto {\n    display: block;\n  }\n\n  .mosal-hero-beneficio-titulo {\n    color: #ffffff;\n    font-size: 13px;\n    line-height: 1.25;\n  }\n\n  .mosal-hero-beneficio-texto {\n    margin-top: 5px;\n    color: #8fa7bb;\n    font-size: 10px;\n    line-height: 1.35;\n  }\n\n  #mosal-hero-visual {\n    position: relative;\n    min-height: 600px;\n    display: grid;\n    place-items: center;\n  }\n\n  #mosal-hero-halo {\n    position: absolute;\n    width: 76%;\n    aspect-ratio: 1;\n    border: 1px solid rgba(121,188,255,.23);\n    border-radius: 50%;\n    box-shadow: 0 0 110px rgba(0,135,255,.21), inset 0 0 90px rgba(0,135,255,.12);\n  }\n\n  \/* Tubo corrugado 3D em estilo desenho t\u00e9cnico (Three.js) \u2014 gira conforme o scroll da p\u00e1gina *\/\n  #mosal-hero-tubo3d {\n    position: relative;\n    z-index: 1;\n    width: 118%;\n    max-width: none;\n    height: 620px;\n    margin: 0 -9%;\n    overflow: hidden;\n  }\n\n  #mosal-hero-tubo3d canvas {\n    display: block;\n    width: 100% !important;\n    height: 100% !important;\n    filter: drop-shadow(0 0 6px rgba(87,176,255,.35));\n  }\n\n  \/* R\u00f3tulos das cotas (posicionados pelo script) *\/\n  #mosal-hero-tubo3d .mosal-cota {\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: 2;\n    padding: 3px 7px;\n    border: 1px solid rgba(87,176,255,.55);\n    background: rgba(1,23,44,.72);\n    color: #d6ecff;\n    font-family: \"Courier New\", Consolas, monospace;\n    font-size: 11px;\n    font-weight: 700;\n    letter-spacing: .06em;\n    white-space: nowrap;\n    pointer-events: none;\n    transition: opacity .2s ease;\n  }\n\n  #mosal-hero-tubo3d .mosal-cota-destaque {\n    border-color: #57b0ff;\n    color: #ffffff;\n    font-size: 14px;\n  }\n\n  #mosal-hero-frase {\n    position: absolute;\n    right: 0;\n    bottom: 0;\n    width: 190px;\n    margin: 0;\n    padding: 18px 0 0 18px;\n    border-top: 1px solid #42a3ff;\n    color: #cae4ff;\n    font-size: 11px;\n    font-weight: 800;\n    line-height: 1.65;\n    letter-spacing: .24em;\n    text-transform: uppercase;\n  }\n\n  @media (max-width: 1024px) {\n    #mosal-hero-conteudo {\n      grid-template-columns: 1fr 1fr;\n    }\n\n    #mosal-hero-beneficios {\n      grid-template-columns: 1fr;\n    }\n\n    .mosal-hero-beneficio-texto {\n      display: none;\n    }\n\n    #mosal-hero-visual {\n      min-height: 500px;\n    }\n\n    #mosal-hero-tubo3d {\n      height: 500px;\n    }\n  }\n\n  @media (max-width: 767px) {\n    #mosal-hero-home,\n    #mosal-hero-conteudo {\n      min-height: auto;\n    }\n\n    #mosal-hero-letra-m {\n      left: 50%;\n      top: auto;\n      bottom: 90px;\n      width: 110%;\n      opacity: .12;\n      transform: translateX(-50%);\n    }\n\n    #mosal-hero-conteudo {\n      padding: 76px 24px 54px;\n      grid-template-columns: 1fr;\n    }\n\n    #mosal-hero-titulo {\n      font-size: clamp(40px, 11vw, 58px);\n    }\n\n    #mosal-hero-texto {\n      font-size: 16px;\n    }\n\n    #mosal-hero-beneficios {\n      grid-template-columns: repeat(3, 1fr);\n      gap: 9px;\n      margin-top: 48px;\n    }\n\n    .mosal-hero-beneficio {\n      display: block;\n    }\n\n    .mosal-hero-beneficio > div {\n      margin-top: 9px;\n    }\n\n    .mosal-hero-beneficio-titulo {\n      font-size: 11px;\n    }\n\n    #mosal-hero-visual {\n      min-height: 350px;\n    }\n\n    #mosal-hero-tubo3d {\n      width: 100%;\n      height: 360px;\n      margin: 0;\n    }\n\n    #mosal-hero-tubo3d .mosal-cota {\n      font-size: 9px;\n    }\n\n    #mosal-hero-frase {\n      right: 0;\n      bottom: -16px;\n      width: 150px;\n      font-size: 9px;\n    }\n  }\n<\/style>\n\n<!-- ===== IN\u00cdCIO DA HERO MOSAL ===== -->\n<section id=\"mosal-hero-home\" aria-labelledby=\"mosal-hero-titulo\">\n  <div id=\"mosal-hero-grade\" aria-hidden=\"true\"><\/div>\n  <!-- MARCA-D'\u00c1GUA: s\u00edmbolo da marca Mosal em vetor -->\n  <div id=\"mosal-hero-letra-m\" aria-hidden=\"true\">\n        <svg viewBox=\"140 42 913 526\" preserveAspectRatio=\"xMidYMid meet\" focusable=\"false\">\n          <defs>\n            <linearGradient id=\"mosal-marca-grad-home\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n              <stop offset=\"0\" stop-color=\"#3a8bff\"\/>\n              <stop offset=\"1\" stop-color=\"#1c4fb0\"\/>\n            <\/linearGradient>\n          <\/defs>\n          <!-- faixas -->\n          <g fill=\"#aab7c4\">\n            <polygon points=\"255,357 413,357 413,410 225,410\"\/>\n            <polygon points=\"215,437 413,437 413,490 183,490\"\/>\n            <polygon points=\"175,516 413,516 413,568 140,568\"\/>\n          <\/g>\n          <!-- M azul -->\n          <polygon fill=\"url(#mosal-marca-grad-home)\" points=\"437,42 750,268 1053,42 1053,130 740,415 560,270 560,568 437,568\"\/>\n          <!-- V e perna direita em cinza -->\n          <polygon fill=\"#aab7c4\" points=\"580,315 745,440 1053,162 1053,568 928,568 928,362 745,550 580,385\"\/>\n        <\/svg>\n  <\/div>\n\n  <div id=\"mosal-hero-conteudo\">\n    <!-- COLUNA DE TEXTOS -->\n    <div id=\"mosal-hero-textos\">\n      <p id=\"mosal-hero-etiqueta\">Alum\u00ednio em movimento<\/p>\n\n      <h1 id=\"mosal-hero-titulo\">\n        Pe\u00e7as que fazem opera\u00e7\u00f5es avan\u00e7arem.\n      <\/h1>\n\n      <p id=\"mosal-hero-texto\">\n        Solu\u00e7\u00f5es em alum\u00ednio para ventila\u00e7\u00e3o, exaust\u00e3o e instala\u00e7\u00f5es que constroem um Brasil mais eficiente.\n      <\/p>\n\n      <!-- ALTERAR O LINK DO BOT\u00c3O NO ATRIBUTO href -->\n      <a id=\"mosal-hero-botao\" href=\"https:\/\/novo.mosal.com.br\/?page_id=75\">\n        <span id=\"mosal-hero-botao-texto\">Conhe\u00e7a nossos produtos<\/span>\n        <span aria-hidden=\"true\">\u2192<\/span>\n      <\/a>\n\n      <div id=\"mosal-hero-beneficios\" aria-label=\"Diferenciais Mosal\">\n        <div id=\"mosal-hero-beneficio-01\" class=\"mosal-hero-beneficio\">\n          <span class=\"mosal-hero-beneficio-icone\" aria-hidden=\"true\">01<\/span>\n          <div>\n            <strong class=\"mosal-hero-beneficio-titulo\">Mais seguran\u00e7a<\/strong>\n            <small class=\"mosal-hero-beneficio-texto\">Alum\u00ednio de alta pureza<\/small>\n          <\/div>\n        <\/div>\n\n        <div id=\"mosal-hero-beneficio-02\" class=\"mosal-hero-beneficio\">\n          <span class=\"mosal-hero-beneficio-icone\" aria-hidden=\"true\">02<\/span>\n          <div>\n            <strong class=\"mosal-hero-beneficio-titulo\">Mais durabilidade<\/strong>\n            <small class=\"mosal-hero-beneficio-texto\">Desempenho para instala\u00e7\u00f5es<\/small>\n          <\/div>\n        <\/div>\n\n        <div id=\"mosal-hero-beneficio-03\" class=\"mosal-hero-beneficio\">\n          <span class=\"mosal-hero-beneficio-icone\" aria-hidden=\"true\">03<\/span>\n          <div>\n            <strong class=\"mosal-hero-beneficio-titulo\">Mais efici\u00eancia<\/strong>\n            <small class=\"mosal-hero-beneficio-texto\">Solu\u00e7\u00f5es sob medida<\/small>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- COLUNA DA IMAGEM -->\n    <div id=\"mosal-hero-visual\">\n      <div id=\"mosal-hero-halo\" aria-hidden=\"true\"><\/div>\n\n      <!-- TUBO CORRUGADO 3D EM ESTILO DESENHO T\u00c9CNICO: desenhado pelo script no fim deste widget -->\n      <div id=\"mosal-hero-tubo3d\" role=\"img\" aria-label=\"Desenho t\u00e9cnico 3D do Tubo Compact F+, di\u00e2metro 90 mm, comprimento 5 metros\"><\/div>\n\n      <p id=\"mosal-hero-frase\">\n        Tradi\u00e7\u00e3o que impulsiona o amanh\u00e3.\n      <\/p>\n    <\/div>\n  <\/div>\n<\/section>\n<!-- ===== FIM DA HERO MOSAL ===== -->\n<!-- ===== SCRIPT DO TUBO CORRUGADO 3D (ESTILO DESENHO T\u00c9CNICO) ===== -->\n<script>\n(function () {\n  \/* Velocidade do giro: radianos por pixel rolado *\/\n  var GIRO_POR_PIXEL = 0.0045;\n\n  \/* Textos das cotas (altere aqui) *\/\n  var COTA_DIAMETRO = '\u00d8 90 mm';\n  var COTA_COMPRIMENTO = 'L = 5.000 mm (estendido)';\n  var COTA_CORRUGADO = 'Parede corrugada \u00b7 alum\u00ednio';\n\n  \/* Cores do tra\u00e7o *\/\n  var COR_CONTORNO = 0xd6ecff;\n  var COR_COTA = 0x57b0ff;\n\n  function iniciar() {\n    var alvo = document.getElementById('mosal-hero-tubo3d');\n    if (!alvo || alvo.getAttribute('data-pronto')) return;\n    alvo.setAttribute('data-pronto', '1');\n    var THREE = window.THREE;\n\n    var renderer;\n    try {\n      renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });\n    } catch (e) { return; }\n    renderer.setPixelRatio(Math.min(window.devicePixelRatio || 1, 2));\n    alvo.appendChild(renderer.domElement);\n\n    var cena = new THREE.Scene();\n    var camera = new THREE.PerspectiveCamera(30, 1, 0.1, 100);\n    camera.position.set(0, 0.4, 14);\n\n    \/* Caminho em \"S\", como o tubo flex\u00edvel da foto *\/\n    var caminho = new THREE.CatmullRomCurve3([\n      new THREE.Vector3(-3.3, -1.9, 0.3),\n      new THREE.Vector3(-3.25, -0.2, 0.2),\n      new THREE.Vector3(-2.7, 1.2, 0),\n      new THREE.Vector3(-1.5, 1.75, -0.2),\n      new THREE.Vector3(-0.4, 1.2, -0.3),\n      new THREE.Vector3(0.3, -0.1, -0.1),\n      new THREE.Vector3(1.1, -1.25, 0.2),\n      new THREE.Vector3(2.2, -1.35, 0.3),\n      new THREE.Vector3(3.0, -0.3, 0.1),\n      new THREE.Vector3(3.15, 1.3, 0),\n      new THREE.Vector3(3.15, 2.1, 0)\n    ], false, 'centripetal');\n\n    var RAIO = 0.82, ANEIS = 120, SEG_R = 72, SEG_L = 600;\n    var quadros = caminho.computeFrenetFrames(SEG_L, false);\n\n    var desenho = new THREE.Group();\n    var p = new THREE.Vector3(), n = new THREE.Vector3(), i, j;\n\n    function material(cor, opacidade) {\n      return new THREE.LineBasicMaterial({ color: cor, transparent: true, opacity: opacidade });\n    }\n    function linha(pontos, mat) {\n      var g = new THREE.BufferGeometry().setFromPoints(pontos);\n      var l = new THREE.Line(g, mat);\n      desenho.add(l);\n      return l;\n    }\n    function anelEm(u, r) {\n      var k = Math.round(u * SEG_L), pts = [];\n      caminho.getPointAt(u, p);\n      for (j = 0; j <= SEG_R; j++) {\n        var a = j \/ SEG_R * Math.PI * 2;\n        n.copy(quadros.normals[k]).multiplyScalar(Math.cos(a)).addScaledVector(quadros.binormals[k], Math.sin(a));\n        pts.push(p.clone().addScaledVector(n, r));\n      }\n      return pts;\n    }\n\n    \/* Preenchimento transl\u00facido: d\u00e1 volume e esconde as linhas de tr\u00e1s (linhas ocultas) *\/\n    var casca = new THREE.Mesh(\n      new THREE.TubeGeometry(caminho, SEG_L, RAIO, SEG_R, false),\n      new THREE.MeshBasicMaterial({ color: 0x0b4d91, transparent: true, opacity: 0.42, side: THREE.DoubleSide,\n        polygonOffset: true, polygonOffsetFactor: 1, polygonOffsetUnits: 1 })\n    );\n    desenho.add(casca);\n\n    \/* An\u00e9is da corruga\u00e7\u00e3o (cristas) *\/\n    var matAnel = material(COR_CONTORNO, 0.55);\n    for (i = 1; i < ANEIS; i++) linha(anelEm(i \/ ANEIS, RAIO * 1.035), matAnel);\n\n    \/* Bocas do tubo com tra\u00e7o mais forte *\/\n    var matBoca = material(0xffffff, 1);\n    linha(anelEm(0, RAIO * 1.04), matBoca);\n    linha(anelEm(1, RAIO * 1.04), matBoca);\n    linha(anelEm(0.004, RAIO * 1.04), matBoca);\n    linha(anelEm(0.996, RAIO * 1.04), matBoca);\n\n    \/* Geratrizes (linhas longitudinais) *\/\n    var matGeratriz = material(COR_CONTORNO, 0.35);\n    for (j = 0; j < 8; j++) {\n      var ang = j \/ 8 * Math.PI * 2, pts = [];\n      for (i = 0; i <= SEG_L; i += 4) {\n        caminho.getPointAt(i \/ SEG_L, p);\n        n.copy(quadros.normals[i]).multiplyScalar(Math.cos(ang)).addScaledVector(quadros.binormals[i], Math.sin(ang));\n        pts.push(p.clone().addScaledVector(n, RAIO * 1.036));\n      }\n      linha(pts, matGeratriz);\n    }\n\n    \/* Linha de centro tra\u00e7o-ponto, passando al\u00e9m das bocas *\/\n    var t0v = caminho.getTangentAt(0), t1v = caminho.getTangentAt(1);\n    var centro = [caminho.getPointAt(0).addScaledVector(t0v, -0.9)].concat(caminho.getSpacedPoints(200), [caminho.getPointAt(1).addScaledVector(t1v, 0.9)]);\n    var linhaCentro = new THREE.Line(new THREE.BufferGeometry().setFromPoints(centro),\n      new THREE.LineDashedMaterial({ color: COR_COTA, dashSize: 0.34, gapSize: 0.1, transparent: true, opacity: 0.9 }));\n    linhaCentro.computeLineDistances();\n    desenho.add(linhaCentro);\n\n    \/* ===== COTA DE DI\u00c2METRO na boca inferior ===== *\/\n    var matCota = material(COR_COTA, 1);\n    var bocaP = caminho.getPointAt(0), bocaT = t0v.clone().negate();\n    var lado = new THREE.Vector3().crossVectors(bocaT, new THREE.Vector3(0, 0, 1)).normalize();\n    var afast = 1.0, R = RAIO * 1.04;\n    var cA = bocaP.clone().addScaledVector(lado, -R).addScaledVector(bocaT, afast);\n    var cB = bocaP.clone().addScaledVector(lado, R).addScaledVector(bocaT, afast);\n    linha([bocaP.clone().addScaledVector(lado, -R).addScaledVector(bocaT, 0.12), cA.clone().addScaledVector(bocaT, 0.18)], matCota);\n    linha([bocaP.clone().addScaledVector(lado, R).addScaledVector(bocaT, 0.12), cB.clone().addScaledVector(bocaT, 0.18)], matCota);\n    linha([cA, cB], matCota);\n    function seta(ponta, dir) {\n      linha([ponta.clone().addScaledVector(dir, 0.24).addScaledVector(bocaT, 0.07), ponta, ponta.clone().addScaledVector(dir, 0.24).addScaledVector(bocaT, -0.07)], matCota);\n    }\n    seta(cA, lado);\n    seta(cB, lado.clone().negate());\n    var ancoraDiametro = bocaP.clone().addScaledVector(bocaT, afast + 0.32);\n\n    \/* Marca de centro (cruz) na boca superior *\/\n    var baseP = caminho.getPointAt(1), baseLado = new THREE.Vector3().crossVectors(t1v, new THREE.Vector3(0, 0, 1)).normalize();\n    var baseB = new THREE.Vector3().crossVectors(t1v, baseLado).normalize();\n    linha([baseP.clone().addScaledVector(baseLado, -0.3), baseP.clone().addScaledVector(baseLado, 0.3)], matCota);\n    linha([baseP.clone().addScaledVector(baseB, -0.3), baseP.clone().addScaledVector(baseB, 0.3)], matCota);\n\n    \/* ===== CHAMADAS (linhas de chamada com texto) ===== *\/\n    var centroCurva = new THREE.Vector3();\n    caminho.getSpacedPoints(50).forEach(function (v) { centroCurva.add(v); });\n    centroCurva.multiplyScalar(1 \/ 51);\n\n    function chamada(u, direcao, compr) {\n      var pt = caminho.getPointAt(u);\n      var d = direcao.clone().normalize();\n      var ini = pt.clone().addScaledVector(d, RAIO * 1.05);\n      var cotovelo = pt.clone().addScaledVector(d, RAIO + compr);\n      var fim = cotovelo.clone().add(new THREE.Vector3(d.x >= 0 ? 0.55 : -0.55, 0, 0));\n      linha([ini, cotovelo, fim], matCota);\n      var ponto = new THREE.Mesh(new THREE.SphereGeometry(0.05, 10, 10), new THREE.MeshBasicMaterial({ color: COR_COTA }));\n      ponto.position.copy(ini);\n      desenho.add(ponto);\n      return { ancora: fim, direita: d.x >= 0 };\n    }\n    var chamadaComprimento = chamada(0.3, new THREE.Vector3(-0.15, 1, 0.1), 0.75);\n    var chamadaParede = chamada(0.6, new THREE.Vector3(-0.45, -1, 0.1), 0.7);\n\n    desenho.position.copy(centroCurva).negate();\n    var grupo = new THREE.Group();\n    grupo.add(desenho);\n    grupo.rotation.z = -0.08;\n    cena.add(grupo);\n\n    \/* ===== R\u00d3TULOS HTML que acompanham o 3D ===== *\/\n    function rotulo(texto, classe) {\n      var el = document.createElement('span');\n      el.className = 'mosal-cota ' + (classe || '');\n      el.textContent = texto;\n      el.setAttribute('aria-hidden', 'true');\n      alvo.appendChild(el);\n      return el;\n    }\n    var rotulos = [\n      { el: rotulo(COTA_DIAMETRO, 'mosal-cota-destaque'), pos: ancoraDiametro, alinhar: 'centro' },\n      { el: rotulo(COTA_COMPRIMENTO), pos: chamadaComprimento.ancora, alinhar: chamadaComprimento.direita ? 'esquerda' : 'direita' },\n      { el: rotulo(COTA_CORRUGADO), pos: chamadaParede.ancora, alinhar: chamadaParede.direita ? 'esquerda' : 'direita' }\n    ];\n    var proj = new THREE.Vector3();\n\n    function posicionarRotulos(w, h) {\n      rotulos.forEach(function (r) {\n        proj.copy(r.pos).applyMatrix4(desenho.matrixWorld).project(camera);\n        var x = (proj.x + 1) \/ 2 * w, y = (1 - proj.y) \/ 2 * h;\n        var dx = r.alinhar === 'centro' ? '-50%' : (r.alinhar === 'esquerda' ? '8px' : 'calc(-100% - 8px)');\n        r.el.style.transform = 'translate(' + x.toFixed(1) + 'px,' + y.toFixed(1) + 'px) translate(' + dx + ',-50%)';\n        r.el.style.opacity = proj.z < 1 ? 1 : 0;\n      });\n    }\n\n    var largura = 0, altura = 0;\n    function ajustar() {\n      largura = alvo.clientWidth; altura = alvo.clientHeight;\n      if (!largura || !altura) return;\n      renderer.setSize(largura, altura, false);\n      camera.aspect = largura \/ altura;\n      \/* afasta a c\u00e2mera em telas estreitas para o desenho caber inteiro *\/\n      camera.position.z = largura \/ altura < 1.1 ? 14 * 1.1 \/ (largura \/ altura) : 14;\n      camera.updateProjectionMatrix();\n    }\n    ajustar();\n    window.addEventListener('resize', ajustar);\n\n    var reduzido = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    var giroAtual = window.scrollY * GIRO_POR_PIXEL, visivel = true, tIni = performance.now();\n\n    if ('IntersectionObserver' in window) {\n      new IntersectionObserver(function (e) { visivel = e[0].isIntersecting; }).observe(alvo);\n    }\n\n    function quadro(t) {\n      requestAnimationFrame(quadro);\n      if (!visivel) return;\n      var giroAlvo = window.scrollY * GIRO_POR_PIXEL;\n      giroAtual += (giroAlvo - giroAtual) * 0.08; \/* suaviza o giro *\/\n      var flutua = reduzido ? 0 : (t - tIni) \/ 1000;\n      grupo.rotation.y = giroAtual + Math.sin(flutua * 0.5) * 0.12;\n      grupo.rotation.x = 0.12 + Math.sin(flutua * 0.4) * 0.04 + giroAtual * 0.05;\n      grupo.position.y = Math.sin(flutua * 0.8) * 0.08;\n      renderer.render(cena, camera);\n      posicionarRotulos(largura, altura);\n    }\n    requestAnimationFrame(quadro);\n  }\n\n  if (window.THREE && window.THREE.WebGLRenderer) {\n    iniciar();\n  } else {\n    var s = document.createElement('script');\n    s.src = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js';\n    s.onload = iniciar;\n    document.head.appendChild(s);\n  }\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-15f1d10f e-con-full e-flex e-con e-parent\" data-id=\"15f1d10f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-910b683 elementor-widget elementor-widget-html\" data-id=\"910b683\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  MOSAL | SE\u00c7\u00c3O QUEM \u00c9 A MOSAL\n  COMO USAR NO ELEMENTOR:\n  1. Adicione um novo widget HTML abaixo da hero.\n  2. Cole este arquivo inteiro no widget.\n  3. O t\u00ea ventilante 3D \u00e9 gerado pelo script no fim do widget (Three.js). Ajuste GIRO_POR_PIXEL para mudar a velocidade do giro.\n  4. Altere textos, n\u00fameros e link usando os IDs indicados.\n-->\n\n<style>\n  \/* ===== SE\u00c7\u00c3O QUEM \u00c9 A MOSAL: VARI\u00c1VEIS F\u00c1CEIS DE ALTERAR ===== *\/\n  #mosal-quem-e {\n    --mosal-quem-azul: #0878f9;\n    --mosal-quem-marinho: #03294c;\n    --mosal-quem-texto: #506579;\n    --mosal-quem-fundo: #edf4f8;\n    --mosal-quem-linha: #d1dde6;\n    position: relative;\n    overflow: hidden;\n    padding: clamp(78px, 9vw, 140px) clamp(28px, 6vw, 100px);\n    background:\n      radial-gradient(circle at 93% 10%, rgba(8,120,249,.10), transparent 31%),\n      linear-gradient(135deg, #f7fbfd 0%, var(--mosal-quem-fundo) 100%);\n    color: var(--mosal-quem-marinho);\n    font-family: Arial, Helvetica, sans-serif;\n  }\n\n  #mosal-quem-e,\n  #mosal-quem-e * {\n    box-sizing: border-box;\n  }\n\n  #mosal-quem-grade {\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n    background-image:\n      linear-gradient(rgba(3,41,76,.035) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(3,41,76,.035) 1px, transparent 1px);\n    background-size: 74px 74px;\n    -webkit-mask-image: linear-gradient(90deg, transparent, #000 80%);\n    mask-image: linear-gradient(90deg, transparent, #000 80%);\n  }\n\n  #mosal-quem-container {\n    position: relative;\n    z-index: 1;\n    width: min(1400px, 100%);\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: minmax(0, .88fr) minmax(470px, 1.12fr);\n    gap: clamp(55px, 8vw, 125px);\n    align-items: center;\n  }\n\n  #mosal-quem-etiqueta {\n    margin: 0 0 22px;\n    color: #547692;\n    font-size: 12px;\n    font-weight: 800;\n    line-height: 1.4;\n    letter-spacing: .31em;\n    text-transform: uppercase;\n  }\n\n  #mosal-quem-titulo {\n    max-width: 690px;\n    margin: 0;\n    color: var(--mosal-quem-marinho);\n    font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    overflow-wrap: break-word;\n    font-weight: 800;\n    line-height: .96;\n    letter-spacing: -.055em;\n  }\n\n  #mosal-quem-texto {\n    max-width: 650px;\n    margin: 28px 0 0;\n    color: var(--mosal-quem-texto);\n    font-size: 17px;\n    line-height: 1.72;\n  }\n\n  #mosal-quem-botao {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 15px;\n    margin-top: 34px;\n    padding: 16px 23px;\n    border-radius: 999px;\n    background: var(--mosal-quem-azul);\n    color: #ffffff;\n    box-shadow: 0 13px 30px rgba(8,120,249,.22);\n    font-size: 13px;\n    font-weight: 800;\n    line-height: 1;\n    text-decoration: none;\n    transition: transform .2s ease, box-shadow .2s ease;\n  }\n\n  #mosal-quem-botao:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 17px 36px rgba(8,120,249,.32);\n  }\n\n  #mosal-quem-numeros {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 22px;\n    margin-top: 64px;\n    padding-top: 29px;\n    border-top: 1px solid var(--mosal-quem-linha);\n  }\n\n  .mosal-quem-numero {\n    position: relative;\n    min-width: 0;\n  }\n\n  .mosal-quem-numero-valor {\n    display: block;\n    color: var(--mosal-quem-marinho);\n    font-size: clamp(29px, 3vw, 43px);\n    font-weight: 850;\n    line-height: 1;\n    letter-spacing: -.055em;\n  }\n\n  .mosal-quem-numero-texto {\n    display: block;\n    margin-top: 9px;\n    color: #687d8f;\n    font-size: 12px;\n    line-height: 1.4;\n  }\n\n  #mosal-quem-visual {\n    position: relative;\n    min-height: 610px;\n  }\n\n  #mosal-quem-moldura {\n    position: absolute;\n    inset: 0;\n    overflow: hidden;\n    border-radius: 64px 0 64px 0;\n    background:\n      radial-gradient(circle at 50% 38%, #ffffff 0%, #dde6ec 45%, #aebfcb 100%);\n    box-shadow: 0 32px 80px rgba(3,41,76,.18);\n  }\n\n  \/* T\u00ea ventilante 3D (Three.js) \u2014 gira conforme o scroll da p\u00e1gina *\/\n  #mosal-quem-te3d {\n    position: absolute;\n    inset: 0 0 12% 0;\n  }\n\n  #mosal-quem-te3d canvas {\n    display: block;\n    width: 100% !important;\n    height: 100% !important;\n  }\n\n  #mosal-quem-selo {\n    position: absolute;\n    right: -1px;\n    bottom: -1px;\n    width: min(270px, 47%);\n    padding: 30px 32px;\n    background: var(--mosal-quem-marinho);\n    color: #ffffff;\n  }\n\n  #mosal-quem-selo-linha {\n    display: block;\n    width: 36px;\n    height: 3px;\n    margin-bottom: 17px;\n    background: var(--mosal-quem-azul);\n  }\n\n  #mosal-quem-selo-texto {\n    margin: 0;\n    font-size: 12px;\n    font-weight: 800;\n    line-height: 1.6;\n    letter-spacing: .24em;\n    text-transform: uppercase;\n  }\n\n  #mosal-quem-codigo {\n    position: absolute;\n    top: -24px;\n    right: -9px;\n    color: rgba(3,41,76,.26);\n    font-size: 11px;\n    font-weight: 800;\n    letter-spacing: .18em;\n  }\n\n  @media (max-width: 1024px) {\n    #mosal-quem-container {\n      grid-template-columns: 1fr 1fr;\n      gap: 50px;\n    }\n\n    #mosal-quem-visual {\n      min-height: 530px;\n    }\n\n    #mosal-quem-selo {\n      width: 56%;\n    }\n  }\n\n  @media (max-width: 767px) {\n    #mosal-quem-e {\n      padding: 76px 24px;\n    }\n\n    #mosal-quem-container {\n      grid-template-columns: 1fr;\n      gap: 62px;\n    }\n\n    #mosal-quem-titulo {\n      font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    }\n\n    #mosal-quem-texto {\n      font-size: 16px;\n    }\n\n    #mosal-quem-numeros {\n      gap: 12px;\n      margin-top: 48px;\n    }\n\n    .mosal-quem-numero-valor {\n      font-size: 28px;\n    }\n\n    .mosal-quem-numero-texto {\n      font-size: 10px;\n    }\n\n    #mosal-quem-visual {\n      min-height: 450px;\n    }\n\n    #mosal-quem-moldura {\n      border-radius: 42px 0 42px 0;\n    }\n\n    #mosal-quem-selo {\n      width: 65%;\n      padding: 24px;\n    }\n\n    #mosal-quem-selo-texto {\n      font-size: 10px;\n    }\n  }\n<\/style>\n\n<!-- ===== IN\u00cdCIO DA SE\u00c7\u00c3O QUEM \u00c9 A MOSAL ===== -->\n<section id=\"mosal-quem-e\" aria-labelledby=\"mosal-quem-titulo\">\n  <div id=\"mosal-quem-grade\" aria-hidden=\"true\"><\/div>\n\n  <div id=\"mosal-quem-container\">\n    <!-- COLUNA DE CONTE\u00daDO -->\n    <div id=\"mosal-quem-conteudo\">\n      <p id=\"mosal-quem-etiqueta\">Quem \u00e9 a Mosal<\/p>\n\n      <h2 id=\"mosal-quem-titulo\">\n        Tradi\u00e7\u00e3o em alum\u00ednio para um futuro maior.\n      <\/h2>\n\n      <p id=\"mosal-quem-texto\">\n        H\u00e1 mais de 30 anos, a Mosal desenvolve e fabrica pe\u00e7as em alum\u00ednio com qualidade, precis\u00e3o e aten\u00e7\u00e3o ao que realmente importa: o sucesso das opera\u00e7\u00f5es dos nossos clientes.\n      <\/p>\n\n      <!-- ALTERAR O LINK DO BOT\u00c3O NO ATRIBUTO href -->\n      <a id=\"mosal-quem-botao\" href=\"#nossa-historia\">\n        <span id=\"mosal-quem-botao-texto\">Nossa hist\u00f3ria<\/span>\n        <span aria-hidden=\"true\">\u2192<\/span>\n      <\/a>\n\n      <div id=\"mosal-quem-numeros\" aria-label=\"N\u00fameros da Mosal\">\n        <div id=\"mosal-quem-numero-01\" class=\"mosal-quem-numero\">\n          <strong class=\"mosal-quem-numero-valor\">+30<\/strong>\n          <span class=\"mosal-quem-numero-texto\">anos de mercado<\/span>\n        <\/div>\n\n        <div id=\"mosal-quem-numero-02\" class=\"mosal-quem-numero\">\n          <strong class=\"mosal-quem-numero-valor\">100%<\/strong>\n          <span class=\"mosal-quem-numero-texto\">produ\u00e7\u00e3o nacional<\/span>\n        <\/div>\n\n        <div id=\"mosal-quem-numero-03\" class=\"mosal-quem-numero\">\n          <strong class=\"mosal-quem-numero-valor\">+1.000<\/strong>\n          <span class=\"mosal-quem-numero-texto\">clientes atendidos<\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- COLUNA DA IMAGEM -->\n    <div id=\"mosal-quem-visual\">\n      <span id=\"mosal-quem-codigo\" aria-hidden=\"true\">MOSAL \/ 02<\/span>\n\n      <div id=\"mosal-quem-moldura\">\n        <!-- T\u00ca VENTILANTE 3D: desenhado pelo script no fim deste widget -->\n        <div id=\"mosal-quem-te3d\" role=\"img\" aria-label=\"T\u00ea ventilante de alum\u00ednio Mosal em 3D\"><\/div>\n\n        <div id=\"mosal-quem-selo\">\n          <span id=\"mosal-quem-selo-linha\" aria-hidden=\"true\"><\/span>\n          <p id=\"mosal-quem-selo-texto\">Qualidade em cada detalhe<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n<!-- ===== FIM DA SE\u00c7\u00c3O QUEM \u00c9 A MOSAL ===== -->\n<!-- ===== SCRIPT DO T\u00ca VENTILANTE 3D ===== -->\n<script>\n(function () {\n  \/* Velocidade do giro: radianos por pixel rolado *\/\n  var GIRO_POR_PIXEL = 0.004;\n\n  function iniciar() {\n    var alvo = document.getElementById('mosal-quem-te3d');\n    if (!alvo || alvo.getAttribute('data-pronto')) return;\n    alvo.setAttribute('data-pronto', '1');\n    var THREE = window.THREE;\n\n    var renderer;\n    try {\n      renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });\n    } catch (e) { return; }\n    renderer.setPixelRatio(Math.min(window.devicePixelRatio || 1, 2));\n    renderer.outputEncoding = THREE.sRGBEncoding;\n    renderer.toneMapping = THREE.ACESFilmicToneMapping;\n    renderer.toneMappingExposure = 1.05;\n    alvo.appendChild(renderer.domElement);\n\n    var cena = new THREE.Scene();\n    var camera = new THREE.PerspectiveCamera(30, 1, 0.1, 100);\n    camera.position.set(0, 1.6, 12);\n    camera.lookAt(0, 0, 0);\n\n    \/* Ambiente de reflexo claro, de est\u00fadio, para o alum\u00ednio escovado *\/\n    var estudio = new THREE.Scene();\n    estudio.background = new THREE.Color(0x3b4b58);\n    function painel(cor, w, h, x, y, z) {\n      var m = new THREE.Mesh(new THREE.PlaneGeometry(w, h), new THREE.MeshBasicMaterial({ color: cor, side: THREE.DoubleSide }));\n      m.position.set(x, y, z);\n      m.lookAt(0, 0, 0);\n      estudio.add(m);\n    }\n    painel(0xffffff, 16, 4, 0, 10, 2);\n    painel(0xffffff, 2, 14, -10, 0, 4);\n    painel(0xeef4fa, 2, 14, 10, 1, -2);\n    painel(0x9fb6c8, 20, 6, 0, -9, 0);\n    painel(0xffffff, 5, 5, 5, 3, 10);\n    painel(0x1a2a38, 12, 12, 0, 0, -11);\n    var pmrem = new THREE.PMREMGenerator(renderer);\n    var envMap = pmrem.fromScene(estudio, 0.04).texture;\n\n    cena.add(new THREE.HemisphereLight(0xffffff, 0x8aa0b2, 0.35));\n    var luz = new THREE.DirectionalLight(0xffffff, 0.9);\n    luz.position.set(5, 8, 7);\n    cena.add(luz);\n\n    var aluminio = new THREE.MeshStandardMaterial({\n      color: 0xcfd4d9, metalness: 1, roughness: 0.24, envMap: envMap, envMapIntensity: 1.15, side: THREE.FrontSide\n    });\n    var interno = new THREE.MeshStandardMaterial({\n      color: 0x14181c, metalness: 0.6, roughness: 0.55, side: THREE.BackSide\n    });\n\n    var peca = new THREE.Group();\n\n    \/* Chap\u00e9u: meia-cana horizontal aberta embaixo *\/\n    var RAIO_CHAPEU = 1.12, COMPR = 4.6, ABERTURA = Math.PI * 0.62;\n    var chapeuGeo = new THREE.CylinderGeometry(RAIO_CHAPEU, RAIO_CHAPEU, COMPR, 128, 1, true,\n      Math.PI * 1.5 + ABERTURA \/ 2, Math.PI * 2 - ABERTURA);\n    chapeuGeo.rotateZ(Math.PI \/ 2);\n    var chapeu = new THREE.Group();\n    chapeu.add(new THREE.Mesh(chapeuGeo, aluminio), new THREE.Mesh(chapeuGeo, interno));\n    chapeu.position.y = 0.9;\n    peca.add(chapeu);\n\n    \/* Duto vertical que entra no chap\u00e9u *\/\n    var RAIO_DUTO = 0.78, ALT_DUTO = 2.2;\n    var dutoGeo = new THREE.CylinderGeometry(RAIO_DUTO, RAIO_DUTO, ALT_DUTO, 96, 1, true);\n    var duto = new THREE.Group();\n    duto.add(new THREE.Mesh(dutoGeo, aluminio), new THREE.Mesh(dutoGeo, interno));\n    duto.position.y = 0.9 - ALT_DUTO \/ 2;\n    peca.add(duto);\n\n    \/* Costura vertical da chapa, como na pe\u00e7a real *\/\n    var costura = new THREE.Mesh(new THREE.BoxGeometry(0.035, ALT_DUTO, 0.03), aluminio);\n    costura.position.set(0.18, duto.position.y, RAIO_DUTO + 0.005);\n    peca.add(costura);\n\n    peca.position.y = -0.1;\n    cena.add(peca);\n\n    \/* Sombra suave no \"ch\u00e3o\" *\/\n    var sombraCanvas = document.createElement('canvas');\n    sombraCanvas.width = sombraCanvas.height = 128;\n    var ctx = sombraCanvas.getContext('2d');\n    var grad = ctx.createRadialGradient(64, 64, 0, 64, 64, 64);\n    grad.addColorStop(0, 'rgba(18,28,38,.38)');\n    grad.addColorStop(1, 'rgba(18,28,38,0)');\n    ctx.fillStyle = grad;\n    ctx.fillRect(0, 0, 128, 128);\n    var sombra = new THREE.Mesh(new THREE.PlaneGeometry(4.6, 4.6),\n      new THREE.MeshBasicMaterial({ map: new THREE.CanvasTexture(sombraCanvas), transparent: true, depthWrite: false }));\n    sombra.rotation.x = -Math.PI \/ 2;\n    sombra.position.y = 0.9 - ALT_DUTO - 0.12;\n    cena.add(sombra);\n\n    function ajustar() {\n      var w = alvo.clientWidth, h = alvo.clientHeight;\n      if (!w || !h) return;\n      renderer.setSize(w, h, false);\n      camera.aspect = w \/ h;\n      \/* afasta a c\u00e2mera em telas estreitas para a pe\u00e7a caber inteira *\/\n      var dist = w \/ h < 1.05 ? 12 * 1.05 \/ (w \/ h) : 12;\n      camera.position.set(0, dist * 0.13, dist);\n      camera.lookAt(0, -0.2, 0);\n      camera.updateProjectionMatrix();\n    }\n    ajustar();\n    window.addEventListener('resize', ajustar);\n\n    var reduzido = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    var giroAtual = window.scrollY * GIRO_POR_PIXEL, visivel = true, t0 = performance.now();\n\n    if ('IntersectionObserver' in window) {\n      new IntersectionObserver(function (e) { visivel = e[0].isIntersecting; }).observe(alvo);\n    }\n\n    function quadro(t) {\n      requestAnimationFrame(quadro);\n      if (!visivel) return;\n      var giroAlvo = window.scrollY * GIRO_POR_PIXEL;\n      giroAtual += (giroAlvo - giroAtual) * 0.08; \/* suaviza o giro *\/\n      var flutua = reduzido ? 0 : (t - t0) \/ 1000;\n      peca.rotation.y = -0.6 + giroAtual + Math.sin(flutua * 0.5) * 0.1;\n      peca.rotation.z = Math.sin(flutua * 0.6) * 0.03;\n      peca.position.y = -0.1 + Math.sin(flutua * 0.9) * 0.06;\n      renderer.render(cena, camera);\n    }\n    requestAnimationFrame(quadro);\n  }\n\n  \/* Reaproveita o Three.js se a hero j\u00e1 carregou (ou est\u00e1 carregando) *\/\n  if (window.THREE && window.THREE.WebGLRenderer) {\n    iniciar();\n  } else {\n    var existente = document.querySelector('script[src*=\"three.min.js\"]');\n    if (existente) {\n      existente.addEventListener('load', iniciar);\n    } else {\n      var s = document.createElement('script');\n      s.src = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js';\n      s.onload = iniciar;\n      document.head.appendChild(s);\n    }\n  }\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1deae7b0 e-con-full e-flex e-con e-parent\" data-id=\"1deae7b0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2d64a2c elementor-widget elementor-widget-html\" data-id=\"2d64a2c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  MOSAL | SE\u00c7\u00c3O PARA CADA DESAFIO, UMA SOLU\u00c7\u00c3O MOSAL\n  COMO USAR NO ELEMENTOR:\n  1. Adicione um widget HTML abaixo da se\u00e7\u00e3o \u201cQuem \u00e9 a Mosal\u201d.\n  2. Cole este arquivo inteiro no widget.\n  3. As ilustra\u00e7\u00f5es s\u00e3o vetores SVG embutidos em cada painel (blocos <svg>). As cores podem ser trocadas nos atributos fill.\n  4. As abas funcionam somente com HTML e CSS. N\u00e3o \u00e9 necess\u00e1rio JavaScript.\n-->\n\n<style>\n  #mosal-desafios {\n    --mosal-desafios-azul: #0878f9;\n    --mosal-desafios-marinho: #011b32;\n    --mosal-desafios-marinho-2: #042846;\n    --mosal-desafios-branco: #ffffff;\n    --mosal-desafios-texto: #506579;\n    position: relative;\n    overflow: hidden;\n    padding: clamp(78px, 9vw, 135px) clamp(28px, 6vw, 100px);\n    background:\n      radial-gradient(circle at 10% 80%, #075899 0%, transparent 30%),\n      linear-gradient(125deg, #01172c 0%, #03294b 55%, #011b32 100%);\n    color: var(--mosal-desafios-branco);\n    font-family: Arial, Helvetica, sans-serif;\n  }\n\n  #mosal-desafios,\n  #mosal-desafios * {\n    box-sizing: border-box;\n  }\n\n  #mosal-desafios-grade {\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n    background-image:\n      linear-gradient(rgba(121,188,255,.055) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(121,188,255,.055) 1px, transparent 1px);\n    background-size: 72px 72px;\n    -webkit-mask-image: linear-gradient(90deg, #000, transparent 70%);\n    mask-image: linear-gradient(90deg, #000, transparent 70%);\n  }\n\n  \/* S\u00edmbolo da marca Mosal como marca-d'\u00e1gua (mesmo vetor do hero) *\/\n  #mosal-desafios-marca {\n    position: absolute;\n    left: -40px;\n    bottom: -70px;\n    width: clamp(380px, 42vw, 680px);\n    margin: 0;\n    opacity: .15;\n    pointer-events: none;\n    user-select: none;\n  }\n\n  #mosal-desafios-marca svg {\n    display: block;\n    width: 100%;\n    height: auto;\n  }\n\n  #mosal-desafios-container {\n    position: relative;\n    z-index: 1;\n    width: min(1400px, 100%);\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: minmax(310px, .72fr) minmax(570px, 1.28fr);\n    gap: clamp(55px, 8vw, 125px);\n    align-items: center;\n  }\n\n  #mosal-desafios-etiqueta {\n    max-width: 270px;\n    margin: 0 0 24px;\n    color: #9acbff;\n    font-size: 12px;\n    font-weight: 800;\n    line-height: 1.6;\n    letter-spacing: .3em;\n    text-transform: uppercase;\n  }\n\n  #mosal-desafios-titulo {\n    max-width: 580px;\n    margin: 0;\n    color: #ffffff;\n    font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    overflow-wrap: break-word;\n    font-weight: 800;\n    line-height: .93;\n    letter-spacing: -.06em;\n  }\n\n  #mosal-desafios-texto {\n    max-width: 500px;\n    margin: 28px 0 0;\n    color: #abc0d1;\n    font-size: 16px;\n    line-height: 1.7;\n  }\n\n  .mosal-desafios-radio {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  #mosal-desafios-abas {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 10px;\n    margin-bottom: 14px;\n  }\n\n  .mosal-desafios-aba {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 52px;\n    padding: 12px 16px;\n    border: 1px solid rgba(142,190,231,.24);\n    border-radius: 999px;\n    color: #c7d7e4;\n    font-size: 13px;\n    font-weight: 800;\n    text-align: center;\n    cursor: pointer;\n    transition: background .2s ease, border-color .2s ease, color .2s ease;\n  }\n\n  .mosal-desafios-aba:hover {\n    border-color: #5aaaff;\n    color: #ffffff;\n  }\n\n  #mosal-desafio-construtoras:checked ~ #mosal-desafios-abas label[for=\"mosal-desafio-construtoras\"],\n  #mosal-desafio-revendedores:checked ~ #mosal-desafios-abas label[for=\"mosal-desafio-revendedores\"],\n  #mosal-desafio-utilidades:checked ~ #mosal-desafios-abas label[for=\"mosal-desafio-utilidades\"] {\n    border-color: var(--mosal-desafios-azul);\n    background: var(--mosal-desafios-azul);\n    color: #ffffff;\n    box-shadow: 0 10px 28px rgba(8,120,249,.28);\n  }\n\n  #mosal-desafios-paineis {\n    position: relative;\n    min-height: 390px;\n  }\n\n  .mosal-desafios-painel {\n    position: absolute;\n    inset: 0;\n    display: none;\n    grid-template-columns: minmax(0, 1fr) 36%;\n    min-height: 390px;\n    overflow: hidden;\n    border-radius: 26px;\n    background: #f6f9fb;\n    color: var(--mosal-desafios-marinho);\n    box-shadow: 0 35px 80px rgba(0,11,22,.38);\n  }\n\n  #mosal-desafio-construtoras:checked ~ #mosal-desafios-paineis #mosal-desafios-painel-construtoras,\n  #mosal-desafio-revendedores:checked ~ #mosal-desafios-paineis #mosal-desafios-painel-revendedores,\n  #mosal-desafio-utilidades:checked ~ #mosal-desafios-paineis #mosal-desafios-painel-utilidades {\n    display: grid;\n  }\n\n  .mosal-desafios-painel-conteudo {\n    padding: clamp(36px, 5vw, 68px);\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  .mosal-desafios-painel-numero {\n    margin: 0 0 28px;\n    color: var(--mosal-desafios-azul);\n    font-size: 12px;\n    font-weight: 850;\n    letter-spacing: .18em;\n  }\n\n  .mosal-desafios-painel-titulo {\n    margin: 0;\n    color: var(--mosal-desafios-marinho);\n    font-size: clamp(26px, 2.5vw, 40px);\n    font-weight: 800;\n    line-height: 1;\n    letter-spacing: -.045em;\n  }\n\n  .mosal-desafios-painel-texto {\n    max-width: 520px;\n    margin: 20px 0 0;\n    color: var(--mosal-desafios-texto);\n    font-size: 15px;\n    line-height: 1.65;\n  }\n\n  .mosal-desafios-painel-link {\n    display: inline-flex;\n    align-items: center;\n    gap: 12px;\n    width: fit-content;\n    margin-top: 31px;\n    color: var(--mosal-desafios-azul);\n    font-size: 13px;\n    font-weight: 850;\n    text-decoration: none;\n  }\n\n  .mosal-desafios-painel-link:hover {\n    text-decoration: underline;\n    text-underline-offset: 5px;\n  }\n\n  \/* Ilustra\u00e7\u00f5es vetoriais (SVG) das abas *\/\n  .mosal-desafios-painel-imagem {\n    width: 100%;\n    height: 100%;\n    min-height: 390px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 22px 16px;\n    background: #e3eef8;\n  }\n\n  #mosal-desafios-painel-revendedores .mosal-desafios-painel-imagem {\n    background: #e8f0f6;\n  }\n\n  #mosal-desafios-painel-utilidades .mosal-desafios-painel-imagem {\n    background: #eef3f7;\n  }\n\n  .mosal-desafios-vetor {\n    width: 100%;\n    height: 100%;\n    max-height: 360px;\n    display: block;\n  }\n\n  #mosal-desafios-instrucao {\n    margin: 20px 0 0;\n    color: #7892a7;\n    font-size: 11px;\n    line-height: 1.5;\n    text-align: right;\n  }\n\n  @media (max-width: 1024px) {\n    #mosal-desafios-container {\n      grid-template-columns: .75fr 1.25fr;\n      gap: 45px;\n    }\n\n    .mosal-desafios-painel {\n      grid-template-columns: 1fr 32%;\n    }\n  }\n\n  @media (max-width: 767px) {\n    #mosal-desafios {\n      padding: 76px 24px;\n    }\n\n    #mosal-desafios-container {\n      grid-template-columns: minmax(0, 1fr);\n      gap: 55px;\n    }\n\n    #mosal-desafios-introducao,\n    #mosal-desafios-interativo {\n      min-width: 0;\n    }\n\n    #mosal-desafios-titulo {\n      font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    }\n\n    #mosal-desafios-abas {\n      display: flex;\n      gap: 8px;\n      overflow-x: auto;\n      padding-bottom: 4px;\n      scrollbar-width: none;\n    }\n\n    #mosal-desafios-abas::-webkit-scrollbar {\n      display: none;\n    }\n\n    .mosal-desafios-aba {\n      min-width: 145px;\n    }\n\n    #mosal-desafios-paineis,\n    .mosal-desafios-painel {\n      min-height: 610px;\n    }\n\n    .mosal-desafios-painel {\n      grid-template-columns: 1fr;\n      grid-template-rows: 1fr 230px;\n    }\n\n    .mosal-desafios-painel-conteudo {\n      padding: 36px 28px;\n    }\n\n    .mosal-desafios-painel-imagem {\n      min-height: 230px;\n      padding: 12px;\n    }\n\n    .mosal-desafios-vetor {\n      max-height: 206px;\n    }\n\n    #mosal-desafios-instrucao {\n      text-align: left;\n    }\n  }\n<\/style>\n\n<!-- ===== IN\u00cdCIO DA SE\u00c7\u00c3O PARA CADA DESAFIO ===== -->\n<section id=\"mosal-desafios\" aria-labelledby=\"mosal-desafios-titulo\">\n  <div id=\"mosal-desafios-grade\" aria-hidden=\"true\"><\/div>\n  <div id=\"mosal-desafios-marca\" aria-hidden=\"true\">\n        <svg viewBox=\"140 42 913 526\" preserveAspectRatio=\"xMidYMid meet\" focusable=\"false\">\n          <defs>\n            <linearGradient id=\"mosal-marca-grad-desafios\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n              <stop offset=\"0\" stop-color=\"#3a8bff\"\/>\n              <stop offset=\"1\" stop-color=\"#1c4fb0\"\/>\n            <\/linearGradient>\n          <\/defs>\n          <!-- faixas -->\n          <g fill=\"#aab7c4\">\n            <polygon points=\"255,357 413,357 413,410 225,410\"\/>\n            <polygon points=\"215,437 413,437 413,490 183,490\"\/>\n            <polygon points=\"175,516 413,516 413,568 140,568\"\/>\n          <\/g>\n          <!-- M azul -->\n          <polygon fill=\"url(#mosal-marca-grad-desafios)\" points=\"437,42 750,268 1053,42 1053,130 740,415 560,270 560,568 437,568\"\/>\n          <!-- V e perna direita em cinza -->\n          <polygon fill=\"#aab7c4\" points=\"580,315 745,440 1053,162 1053,568 928,568 928,362 745,550 580,385\"\/>\n        <\/svg>\n  <\/div>\n\n  <div id=\"mosal-desafios-container\">\n    <!-- COLUNA DE APRESENTA\u00c7\u00c3O -->\n    <div id=\"mosal-desafios-introducao\">\n      <p id=\"mosal-desafios-etiqueta\">Para cada desafio, uma solu\u00e7\u00e3o Mosal<\/p>\n\n      <h2 id=\"mosal-desafios-titulo\">\n        Feita para quem constr\u00f3i o amanh\u00e3.\n      <\/h2>\n\n      <p id=\"mosal-desafios-texto\">\n        Solu\u00e7\u00f5es organizadas de acordo com a necessidade de cada cliente, da obra ao ponto de venda.\n      <\/p>\n    <\/div>\n\n    <!-- \u00c1REA INTERATIVA DAS ABAS -->\n    <div id=\"mosal-desafios-interativo\">\n      <input class=\"mosal-desafios-radio\" type=\"radio\" name=\"mosal-desafios-abas\" id=\"mosal-desafio-construtoras\" checked>\n      <input class=\"mosal-desafios-radio\" type=\"radio\" name=\"mosal-desafios-abas\" id=\"mosal-desafio-revendedores\">\n      <input class=\"mosal-desafios-radio\" type=\"radio\" name=\"mosal-desafios-abas\" id=\"mosal-desafio-utilidades\">\n\n      <div id=\"mosal-desafios-abas\" role=\"tablist\" aria-label=\"Solu\u00e7\u00f5es por tipo de cliente\">\n        <label id=\"mosal-desafios-aba-construtoras\" class=\"mosal-desafios-aba\" for=\"mosal-desafio-construtoras\">Construtoras<\/label>\n        <label id=\"mosal-desafios-aba-revendedores\" class=\"mosal-desafios-aba\" for=\"mosal-desafio-revendedores\">Revendedores<\/label>\n        <label id=\"mosal-desafios-aba-utilidades\" class=\"mosal-desafios-aba\" for=\"mosal-desafio-utilidades\">Utilidades<\/label>\n      <\/div>\n\n      <div id=\"mosal-desafios-paineis\">\n        <!-- PAINEL 01: CONSTRUTORAS -->\n        <article id=\"mosal-desafios-painel-construtoras\" class=\"mosal-desafios-painel\">\n          <div class=\"mosal-desafios-painel-conteudo\">\n            <p class=\"mosal-desafios-painel-numero\">01 \/ CONSTRUTORAS<\/p>\n            <h3 class=\"mosal-desafios-painel-titulo\">Ritmo de obra sem falta de pe\u00e7a.<\/h3>\n            <p class=\"mosal-desafios-painel-texto\">Pe\u00e7as confi\u00e1veis, orienta\u00e7\u00e3o t\u00e9cnica e abastecimento para obras que exigem qualidade, prazo e alto desempenho.<\/p>\n            <a class=\"mosal-desafios-painel-link\" href=\"#produtos-construtoras\">Ver produtos para construtoras <span aria-hidden=\"true\">\u2192<\/span><\/a>\n          <\/div>\n          <!-- VETOR: edif\u00edcios em constru\u00e7\u00e3o -->\n          <div class=\"mosal-desafios-painel-imagem\">\n          <svg class=\"mosal-desafios-vetor\" viewBox=\"0 0 300 360\" preserveAspectRatio=\"xMidYMid meet\" role=\"img\" aria-label=\"Ilustra\u00e7\u00e3o de edif\u00edcios em constru\u00e7\u00e3o com guindaste\">\n            <!-- sol e nuvens -->\n            <circle cx=\"236\" cy=\"78\" r=\"30\" fill=\"#ffffff\"\/>\n            <rect x=\"178\" y=\"62\" width=\"62\" height=\"16\" rx=\"8\" fill=\"#ffffff\" opacity=\".85\"\/>\n            <rect x=\"196\" y=\"52\" width=\"30\" height=\"20\" rx=\"10\" fill=\"#ffffff\" opacity=\".85\"\/>\n            <rect x=\"24\" y=\"92\" width=\"54\" height=\"14\" rx=\"7\" fill=\"#ffffff\" opacity=\".8\"\/>\n            <rect x=\"38\" y=\"84\" width=\"26\" height=\"16\" rx=\"8\" fill=\"#ffffff\" opacity=\".8\"\/>\n            <!-- base \/ ch\u00e3o -->\n            <rect x=\"12\" y=\"318\" width=\"276\" height=\"16\" rx=\"8\" fill=\"#03294c\"\/>\n            <!-- pr\u00e9dio pronto (esquerda) -->\n            <rect x=\"26\" y=\"150\" width=\"84\" height=\"170\" fill=\"#03294c\"\/>\n            <rect x=\"22\" y=\"142\" width=\"92\" height=\"10\" fill=\"#042f57\"\/>\n            <g fill=\"#9acbff\">\n              <rect x=\"38\" y=\"164\" width=\"14\" height=\"14\"\/><rect x=\"61\" y=\"164\" width=\"14\" height=\"14\"\/><rect x=\"84\" y=\"164\" width=\"14\" height=\"14\"\/>\n              <rect x=\"38\" y=\"188\" width=\"14\" height=\"14\"\/><rect x=\"61\" y=\"188\" width=\"14\" height=\"14\" fill=\"#0878f9\"\/><rect x=\"84\" y=\"188\" width=\"14\" height=\"14\"\/>\n              <rect x=\"38\" y=\"212\" width=\"14\" height=\"14\" fill=\"#0878f9\"\/><rect x=\"61\" y=\"212\" width=\"14\" height=\"14\"\/><rect x=\"84\" y=\"212\" width=\"14\" height=\"14\"\/>\n              <rect x=\"38\" y=\"236\" width=\"14\" height=\"14\"\/><rect x=\"61\" y=\"236\" width=\"14\" height=\"14\"\/><rect x=\"84\" y=\"236\" width=\"14\" height=\"14\" fill=\"#0878f9\"\/>\n              <rect x=\"38\" y=\"260\" width=\"14\" height=\"14\"\/><rect x=\"61\" y=\"260\" width=\"14\" height=\"14\" fill=\"#0878f9\"\/><rect x=\"84\" y=\"260\" width=\"14\" height=\"14\"\/>\n            <\/g>\n            <rect x=\"56\" y=\"290\" width=\"24\" height=\"30\" fill=\"#0878f9\"\/>\n            <!-- duto de exaust\u00e3o no telhado -->\n            <rect x=\"88\" y=\"120\" width=\"10\" height=\"24\" fill=\"#c9d3dc\"\/>\n            <rect x=\"80\" y=\"112\" width=\"26\" height=\"10\" rx=\"5\" fill=\"#e6ecf1\"\/>\n            <!-- pr\u00e9dio em constru\u00e7\u00e3o (direita): andares prontos -->\n            <rect x=\"150\" y=\"232\" width=\"116\" height=\"88\" fill=\"#0878f9\"\/>\n            <g fill=\"#e3eef8\">\n              <rect x=\"162\" y=\"246\" width=\"18\" height=\"14\"\/><rect x=\"190\" y=\"246\" width=\"18\" height=\"14\"\/><rect x=\"218\" y=\"246\" width=\"18\" height=\"14\"\/><rect x=\"246\" y=\"246\" width=\"12\" height=\"14\"\/>\n              <rect x=\"162\" y=\"272\" width=\"18\" height=\"14\"\/><rect x=\"190\" y=\"272\" width=\"18\" height=\"14\"\/><rect x=\"218\" y=\"272\" width=\"18\" height=\"14\"\/><rect x=\"246\" y=\"272\" width=\"12\" height=\"14\"\/>\n            <\/g>\n            <rect x=\"194\" y=\"296\" width=\"26\" height=\"24\" fill=\"#03294c\"\/>\n            <!-- estrutura (pilares e vigas) -->\n            <g fill=\"#03294c\">\n              <rect x=\"150\" y=\"112\" width=\"7\" height=\"122\"\/>\n              <rect x=\"188\" y=\"112\" width=\"7\" height=\"122\"\/>\n              <rect x=\"223\" y=\"112\" width=\"7\" height=\"122\"\/>\n              <rect x=\"259\" y=\"112\" width=\"7\" height=\"122\"\/>\n              <rect x=\"150\" y=\"112\" width=\"116\" height=\"7\"\/>\n              <rect x=\"150\" y=\"152\" width=\"116\" height=\"7\"\/>\n              <rect x=\"150\" y=\"192\" width=\"116\" height=\"7\"\/>\n            <\/g>\n            <!-- andaime -->\n            <g fill=\"#ffb400\">\n              <rect x=\"268\" y=\"150\" width=\"4\" height=\"170\"\/>\n              <rect x=\"284\" y=\"150\" width=\"4\" height=\"170\"\/>\n              <rect x=\"266\" y=\"190\" width=\"24\" height=\"4\"\/>\n              <rect x=\"266\" y=\"230\" width=\"24\" height=\"4\"\/>\n              <rect x=\"266\" y=\"270\" width=\"24\" height=\"4\"\/>\n            <\/g>\n            <!-- guindaste -->\n            <g fill=\"#ffb400\">\n              <rect x=\"120\" y=\"44\" width=\"12\" height=\"276\"\/>\n              <rect x=\"64\" y=\"40\" width=\"226\" height=\"10\"\/>\n              <rect x=\"112\" y=\"24\" width=\"28\" height=\"20\"\/>\n            <\/g>\n            <g fill=\"#e39b00\">\n              <rect x=\"123\" y=\"70\" width=\"6\" height=\"4\"\/><rect x=\"123\" y=\"110\" width=\"6\" height=\"4\"\/><rect x=\"123\" y=\"150\" width=\"6\" height=\"4\"\/>\n              <rect x=\"123\" y=\"190\" width=\"6\" height=\"4\"\/><rect x=\"123\" y=\"230\" width=\"6\" height=\"4\"\/><rect x=\"123\" y=\"270\" width=\"6\" height=\"4\"\/>\n            <\/g>\n            <rect x=\"116\" y=\"28\" width=\"10\" height=\"10\" fill=\"#9acbff\"\/>\n            <rect x=\"62\" y=\"50\" width=\"30\" height=\"20\" fill=\"#03294c\"\/>\n            <!-- cabo, gancho e pe\u00e7a de alum\u00ednio i\u00e7ada -->\n            <rect x=\"243\" y=\"50\" width=\"2\" height=\"48\" fill=\"#03294c\"\/>\n            <rect x=\"236\" y=\"96\" width=\"16\" height=\"6\" rx=\"3\" fill=\"#03294c\"\/>\n            <rect x=\"210\" y=\"102\" width=\"68\" height=\"12\" rx=\"6\" fill=\"#c9d3dc\"\/>\n            <rect x=\"214\" y=\"104\" width=\"60\" height=\"3\" rx=\"1.5\" fill=\"#ffffff\" opacity=\".7\"\/>\n          <\/svg>\n          <\/div>\n        <\/article>\n\n        <!-- PAINEL 02: REVENDEDORES -->\n        <article id=\"mosal-desafios-painel-revendedores\" class=\"mosal-desafios-painel\">\n          <div class=\"mosal-desafios-painel-conteudo\">\n            <p class=\"mosal-desafios-painel-numero\">02 \/ REVENDEDORES<\/p>\n            <h3 class=\"mosal-desafios-painel-titulo\">Mix que gira. Reposi\u00e7\u00e3o que acompanha.<\/h3>\n            <p class=\"mosal-desafios-painel-texto\">Produtos para manter o estoque preparado, com negocia\u00e7\u00e3o por volume e resposta r\u00e1pida para novas reposi\u00e7\u00f5es.<\/p>\n            <a class=\"mosal-desafios-painel-link\" href=\"#produtos-revendedores\">Ver produtos para revendedores <span aria-hidden=\"true\">\u2192<\/span><\/a>\n          <\/div>\n          <!-- VETOR: pe\u00e7as de alum\u00ednio Mosal na prateleira -->\n          <div class=\"mosal-desafios-painel-imagem\">\n          <svg class=\"mosal-desafios-vetor\" viewBox=\"0 0 300 360\" preserveAspectRatio=\"xMidYMid meet\" role=\"img\" aria-label=\"Ilustra\u00e7\u00e3o de prateleira com pe\u00e7as de alum\u00ednio Mosal: tubo corrugado, t\u00ea ventilante, chap\u00e9u chin\u00eas, curva e grelha\">\n            <!-- estrutura da prateleira -->\n            <rect x=\"18\" y=\"34\" width=\"8\" height=\"300\" fill=\"#03294c\"\/>\n            <rect x=\"274\" y=\"34\" width=\"8\" height=\"300\" fill=\"#03294c\"\/>\n            <rect x=\"14\" y=\"170\" width=\"272\" height=\"10\" fill=\"#03294c\"\/>\n            <rect x=\"14\" y=\"310\" width=\"272\" height=\"10\" fill=\"#03294c\"\/>\n            <rect x=\"14\" y=\"30\" width=\"272\" height=\"8\" fill=\"#042f57\"\/>\n            <!-- etiquetas de pre\u00e7o -->\n            <g fill=\"#0878f9\">\n              <rect x=\"60\" y=\"180\" width=\"30\" height=\"14\"\/><rect x=\"196\" y=\"180\" width=\"30\" height=\"14\"\/>\n              <rect x=\"50\" y=\"320\" width=\"30\" height=\"14\"\/><rect x=\"140\" y=\"320\" width=\"30\" height=\"14\"\/><rect x=\"226\" y=\"320\" width=\"30\" height=\"14\"\/>\n            <\/g>\n            <g fill=\"#ffffff\">\n              <rect x=\"65\" y=\"185\" width=\"20\" height=\"3\"\/><rect x=\"201\" y=\"185\" width=\"20\" height=\"3\"\/>\n              <rect x=\"55\" y=\"325\" width=\"20\" height=\"3\"\/><rect x=\"145\" y=\"325\" width=\"20\" height=\"3\"\/><rect x=\"231\" y=\"325\" width=\"20\" height=\"3\"\/>\n            <\/g>\n\n            <!-- PRATELEIRA DE CIMA -->\n            <!-- tubo corrugado -->\n            <rect x=\"40\" y=\"110\" width=\"104\" height=\"60\" rx=\"10\" fill=\"#c9d3dc\"\/>\n            <g fill=\"#a7b3be\">\n              <rect x=\"50\" y=\"110\" width=\"3\" height=\"60\"\/><rect x=\"58\" y=\"110\" width=\"3\" height=\"60\"\/><rect x=\"66\" y=\"110\" width=\"3\" height=\"60\"\/>\n              <rect x=\"74\" y=\"110\" width=\"3\" height=\"60\"\/><rect x=\"82\" y=\"110\" width=\"3\" height=\"60\"\/><rect x=\"90\" y=\"110\" width=\"3\" height=\"60\"\/>\n              <rect x=\"98\" y=\"110\" width=\"3\" height=\"60\"\/><rect x=\"106\" y=\"110\" width=\"3\" height=\"60\"\/><rect x=\"114\" y=\"110\" width=\"3\" height=\"60\"\/>\n              <rect x=\"122\" y=\"110\" width=\"3\" height=\"60\"\/><rect x=\"130\" y=\"110\" width=\"3\" height=\"60\"\/>\n            <\/g>\n            <rect x=\"44\" y=\"118\" width=\"96\" height=\"6\" rx=\"3\" fill=\"#ffffff\" opacity=\".6\"\/>\n            <ellipse cx=\"40\" cy=\"140\" rx=\"13\" ry=\"30\" fill=\"#e6ecf1\"\/>\n            <ellipse cx=\"40\" cy=\"140\" rx=\"8\" ry=\"23\" fill=\"#5d6a76\"\/>\n            <!-- t\u00ea ventilante -->\n            <rect x=\"198\" y=\"126\" width=\"36\" height=\"44\" fill=\"#bcc7d1\"\/>\n            <rect x=\"204\" y=\"126\" width=\"6\" height=\"44\" fill=\"#ffffff\" opacity=\".5\"\/>\n            <rect x=\"162\" y=\"90\" width=\"108\" height=\"42\" rx=\"21\" fill=\"#d5dde4\"\/>\n            <rect x=\"172\" y=\"97\" width=\"92\" height=\"7\" rx=\"3.5\" fill=\"#ffffff\" opacity=\".75\"\/>\n            <path d=\"M162 111 a21 21 0 0 1 21 -21 v42 a21 21 0 0 1 -21 -21z\" fill=\"#1c252e\"\/>\n\n            <!-- PRATELEIRA DE BAIXO -->\n            <!-- chap\u00e9u chin\u00eas -->\n            <rect x=\"58\" y=\"258\" width=\"30\" height=\"52\" fill=\"#bcc7d1\"\/>\n            <rect x=\"63\" y=\"258\" width=\"5\" height=\"52\" fill=\"#ffffff\" opacity=\".5\"\/>\n            <rect x=\"60\" y=\"238\" width=\"4\" height=\"22\" fill=\"#9aa7b3\"\/>\n            <rect x=\"82\" y=\"238\" width=\"4\" height=\"22\" fill=\"#9aa7b3\"\/>\n            <polygon points=\"30,244 116,244 73,208\" fill=\"#d5dde4\"\/>\n            <polygon points=\"73,208 116,244 96,244\" fill=\"#aab6c1\"\/>\n            <!-- curva 90\u00b0 -->\n            <path d=\"M152 310 V268 A34 34 0 0 1 186 234 H206\" fill=\"none\" stroke=\"#c9d3dc\" stroke-width=\"32\"\/>\n            <path d=\"M152 262 A40 40 0 0 1 176 238\" fill=\"none\" stroke=\"#ffffff\" stroke-width=\"4\" opacity=\".6\"\/>\n            <g fill=\"#a7b3be\">\n              <rect x=\"136\" y=\"286\" width=\"32\" height=\"3\"\/>\n              <rect x=\"186\" y=\"218\" width=\"3\" height=\"32\"\/>\n              <rect x=\"146\" y=\"252\" width=\"30\" height=\"3\" transform=\"rotate(-45 161 253)\"\/>\n            <\/g>\n            <ellipse cx=\"206\" cy=\"234\" rx=\"7\" ry=\"16\" fill=\"#5d6a76\"\/>\n            <!-- grelha de ventila\u00e7\u00e3o -->\n            <rect x=\"218\" y=\"236\" width=\"52\" height=\"74\" rx=\"5\" fill=\"#d5dde4\"\/>\n            <g fill=\"#8d9aa6\">\n              <rect x=\"226\" y=\"246\" width=\"36\" height=\"5\" rx=\"2\"\/><rect x=\"226\" y=\"258\" width=\"36\" height=\"5\" rx=\"2\"\/>\n              <rect x=\"226\" y=\"270\" width=\"36\" height=\"5\" rx=\"2\"\/><rect x=\"226\" y=\"282\" width=\"36\" height=\"5\" rx=\"2\"\/>\n              <rect x=\"226\" y=\"294\" width=\"36\" height=\"5\" rx=\"2\"\/>\n            <\/g>\n          <\/svg>\n          <\/div>\n        <\/article>\n\n        <!-- PAINEL 03: UTILIDADES -->\n        <article id=\"mosal-desafios-painel-utilidades\" class=\"mosal-desafios-painel\">\n          <div class=\"mosal-desafios-painel-conteudo\">\n            <p class=\"mosal-desafios-painel-numero\">03 \/ UTILIDADES<\/p>\n            <h3 class=\"mosal-desafios-painel-titulo\">Alum\u00ednio presente em mais momentos.<\/h3>\n            <p class=\"mosal-desafios-painel-texto\">Uma linha complementar de utilidades para ampliar o portf\u00f3lio de distribuidores e varejistas.<\/p>\n            <a class=\"mosal-desafios-painel-link\" href=\"#produtos-utilidades\">Conhecer a linha de utilidades <span aria-hidden=\"true\">\u2192<\/span><\/a>\n          <\/div>\n          <!-- VETOR: formas de bolo e utilidades em alum\u00ednio -->\n          <div class=\"mosal-desafios-painel-imagem\">\n          <svg class=\"mosal-desafios-vetor\" viewBox=\"0 0 300 360\" preserveAspectRatio=\"xMidYMid meet\" role=\"img\" aria-label=\"Ilustra\u00e7\u00e3o de utilidades em alum\u00ednio: forma de pudim, forma redonda de bolo e assadeira retangular\">\n            <!-- brilhos decorativos -->\n            <g fill=\"#0878f9\">\n              <path d=\"M52 70 l4 10 10 4 -10 4 -4 10 -4 -10 -10 -4 10 -4z\"\/>\n              <path d=\"M250 58 l3 7 7 3 -7 3 -3 7 -3 -7 -7 -3 7 -3z\"\/>\n            <\/g>\n            <path d=\"M232 120 l2 5 5 2 -5 2 -2 5 -2 -5 -5 -2 5 -2z\" fill=\"#9acbff\"\/>\n\n            <!-- assadeira retangular (ao fundo, em p\u00e9) -->\n            <rect x=\"62\" y=\"96\" width=\"176\" height=\"118\" rx=\"10\" fill=\"#bcc7d1\"\/>\n            <rect x=\"74\" y=\"108\" width=\"152\" height=\"94\" rx=\"6\" fill=\"#d9e0e6\"\/>\n            <rect x=\"82\" y=\"116\" width=\"136\" height=\"8\" rx=\"4\" fill=\"#ffffff\" opacity=\".7\"\/>\n            <rect x=\"74\" y=\"190\" width=\"152\" height=\"12\" rx=\"6\" fill=\"#aab6c1\"\/>\n\n            <!-- bancada -->\n            <rect x=\"14\" y=\"300\" width=\"272\" height=\"14\" rx=\"7\" fill=\"#03294c\"\/>\n            <rect x=\"30\" y=\"314\" width=\"240\" height=\"8\" fill=\"#042f57\"\/>\n\n            <!-- forma de pudim (com furo central e caneluras) -->\n            <polygon points=\"26,226 146,226 130,300 42,300\" fill=\"#c9d3dc\"\/>\n            <g fill=\"#a7b3be\">\n              <polygon points=\"44,226 54,226 58,300 50,300\"\/>\n              <polygon points=\"70,226 80,226 80,300 72,300\"\/>\n              <polygon points=\"96,226 106,226 102,300 94,300\"\/>\n              <polygon points=\"122,226 132,226 124,300 116,300\"\/>\n            <\/g>\n            <polygon points=\"30,232 38,232 50,296 46,296\" fill=\"#ffffff\" opacity=\".55\"\/>\n            <ellipse cx=\"86\" cy=\"226\" rx=\"60\" ry=\"15\" fill=\"#e6ecf1\"\/>\n            <ellipse cx=\"86\" cy=\"227\" rx=\"51\" ry=\"11\" fill=\"#8d9aa6\"\/>\n            <rect x=\"77\" y=\"206\" width=\"18\" height=\"21\" fill=\"#d5dde4\"\/>\n            <ellipse cx=\"86\" cy=\"206\" rx=\"9\" ry=\"3.5\" fill=\"#5d6a76\"\/>\n            <ellipse cx=\"86\" cy=\"227\" rx=\"9\" ry=\"3.5\" fill=\"#bcc7d1\"\/>\n\n            <!-- forma redonda de bolo -->\n            <rect x=\"160\" y=\"246\" width=\"118\" height=\"54\" fill=\"#c3cdd6\"\/>\n            <ellipse cx=\"219\" cy=\"300\" rx=\"59\" ry=\"12\" fill=\"#c3cdd6\"\/>\n            <rect x=\"168\" y=\"252\" width=\"10\" height=\"48\" fill=\"#ffffff\" opacity=\".5\"\/>\n            <rect x=\"256\" y=\"252\" width=\"10\" height=\"48\" fill=\"#a7b3be\"\/>\n            <ellipse cx=\"219\" cy=\"246\" rx=\"59\" ry=\"15\" fill=\"#e6ecf1\"\/>\n            <ellipse cx=\"219\" cy=\"247\" rx=\"51\" ry=\"11\" fill=\"#a4b0bb\"\/>\n            <ellipse cx=\"219\" cy=\"249\" rx=\"44\" ry=\"8\" fill=\"#94a1ad\"\/>\n          <\/svg>\n          <\/div>\n        <\/article>\n      <\/div>\n\n      <p id=\"mosal-desafios-instrucao\">Selecione uma categoria para visualizar a solu\u00e7\u00e3o correspondente.<\/p>\n    <\/div>\n  <\/div>\n<\/section>\n<!-- ===== FIM DA SE\u00c7\u00c3O PARA CADA DESAFIO ===== -->\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-229ea1f4 e-con-full e-flex e-con e-parent\" data-id=\"229ea1f4\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-67fc6247 e-flex e-con-boxed e-con e-child\" data-id=\"67fc6247\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-13704366 elementor-widget elementor-widget-heading\" data-id=\"13704366\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">PRODUTOS<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-554ee2da elementor-widget elementor-widget-text-editor\" data-id=\"554ee2da\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Solu\u00e7\u00f5es completas em alum\u00ednio.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6212b25 elementor-widget elementor-widget-eael-woo-product-carousel\" data-id=\"6212b25\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"eael-woo-product-carousel.default\">\n\t\t\t\t\t\n        <div class=\"swiper-container-wrap eael-woo-product-carousel-container preset-1 swiper-container-wrap-dots-outside\" id=\"eael-product-carousel-6212b25\" data-widget-id=\"6212b25\" >\n            <div class=\"woocommerce eael-woo-product-carousel eael-product-appender-6212b25 eael-hide-buttons swiper swiper-8 swiper-container-6212b25 swiper-image-stretch\" data-checkout-url=\"https:\/\/novo.mosal.com.br\/?page_id=89\" data-pagination=\".swiper-pagination-6212b25\" data-arrow-next=\".swiper-button-next-6212b25\" data-arrow-prev=\".swiper-button-prev-6212b25\" data-type=\"preset-1\" data-effect=\"slide\" data-items=\"4\" data-slide-items=\"1\" data-margin=\"10\" data-speed=\"400\" data-autoplay=\"2000\" data-loop=\"1\" data-dots=\"1\"><div class=\"products swiper-wrapper\">    <div class=\"product swiper-slide post-110 type-product status-publish has-post-thumbnail product_cat-grades-de-ventilacao first instock shipping-taxable product-type-simple\">\n        <div class=\"eael-product-carousel \">\n            <div class=\"product-image-wrap\">\n                <div class=\"image-wrap\">\n                    <img decoding=\"async\" width=\"167\" height=\"167\" src=\"https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini.png\" class=\"attachment-medium size-medium\" alt=\"Grade de Ventila\u00e7\u00e3o Redonda\" loading=\"eager\" srcset=\"https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini.png 167w, https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini-150x150.png 150w, https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini-100x100.png 100w\" sizes=\"(max-width: 167px) 100vw, 167px\" \/>                <\/div>\n                <div class=\"image-hover-wrap\">\n                    <ul class=\"icons-wrap box-style\">\n                                                                                                <li class=\"view-details\" title=\"Details\"><a href=\"https:\/\/novo.mosal.com.br\/?product=grade-de-ventilacao-redonda\"><i class=\"fas fa-link\"><\/i><\/a><\/li>\n                    <\/ul>\n                                    <\/div>\n            <\/div>\n            <div class=\"product-details-wrap\">\n                <div class=\"product-details\">\n                    <div class=\"eael-product-title\"><h4>Grade de Ventila\u00e7\u00e3o Redonda<\/h4><\/div>\n                <\/div>\n                            <\/div>\n        <\/div>\n\t<\/div>\n        <div class=\"product swiper-slide post-109 type-product status-publish has-post-thumbnail product_cat-grades-de-ventilacao  instock shipping-taxable product-type-simple\">\n        <div class=\"eael-product-carousel \">\n            <div class=\"product-image-wrap\">\n                <div class=\"image-wrap\">\n                    <img decoding=\"async\" width=\"167\" height=\"167\" src=\"https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini.png\" class=\"attachment-medium size-medium\" alt=\"Grade de Ventila\u00e7\u00e3o de Superf\u00edcie\" loading=\"eager\" srcset=\"https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini.png 167w, https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini-150x150.png 150w, https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini-100x100.png 100w\" sizes=\"(max-width: 167px) 100vw, 167px\" \/>                <\/div>\n                <div class=\"image-hover-wrap\">\n                    <ul class=\"icons-wrap box-style\">\n                                                                                                <li class=\"view-details\" title=\"Details\"><a href=\"https:\/\/novo.mosal.com.br\/?product=grade-de-ventilacao-de-superficie\"><i class=\"fas fa-link\"><\/i><\/a><\/li>\n                    <\/ul>\n                                    <\/div>\n            <\/div>\n            <div class=\"product-details-wrap\">\n                <div class=\"product-details\">\n                    <div class=\"eael-product-title\"><h4>Grade de Ventila\u00e7\u00e3o de Superf\u00edcie<\/h4><\/div>\n                <\/div>\n                            <\/div>\n        <\/div>\n\t<\/div>\n        <div class=\"product swiper-slide post-108 type-product status-publish has-post-thumbnail product_cat-grades-de-ventilacao  instock shipping-taxable product-type-simple\">\n        <div class=\"eael-product-carousel \">\n            <div class=\"product-image-wrap\">\n                <div class=\"image-wrap\">\n                    <img decoding=\"async\" width=\"167\" height=\"167\" src=\"https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini.png\" class=\"attachment-medium size-medium\" alt=\"Grade de Ventila\u00e7\u00e3o\" loading=\"eager\" srcset=\"https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini.png 167w, https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini-150x150.png 150w, https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/Grades20mini-100x100.png 100w\" sizes=\"(max-width: 167px) 100vw, 167px\" \/>                <\/div>\n                <div class=\"image-hover-wrap\">\n                    <ul class=\"icons-wrap box-style\">\n                                                                                                <li class=\"view-details\" title=\"Details\"><a href=\"https:\/\/novo.mosal.com.br\/?product=grade-de-ventilacao\"><i class=\"fas fa-link\"><\/i><\/a><\/li>\n                    <\/ul>\n                                    <\/div>\n            <\/div>\n            <div class=\"product-details-wrap\">\n                <div class=\"product-details\">\n                    <div class=\"eael-product-title\"><h4>Grade de Ventila\u00e7\u00e3o<\/h4><\/div>\n                <\/div>\n                            <\/div>\n        <\/div>\n\t<\/div>\n        <div class=\"product swiper-slide post-106 type-product status-publish has-post-thumbnail product_cat-construcao-civil last instock shipping-taxable product-type-simple\">\n        <div class=\"eael-product-carousel \">\n            <div class=\"product-image-wrap\">\n                <div class=\"image-wrap\">\n                    <img decoding=\"async\" width=\"219\" height=\"167\" src=\"https:\/\/novo.mosal.com.br\/wp-content\/uploads\/2026\/10\/AbraC3A7adeira20mini.png\" class=\"attachment-medium size-medium\" alt=\"Abra\u00e7adeira\" loading=\"eager\" \/>                <\/div>\n                <div class=\"image-hover-wrap\">\n                    <ul class=\"icons-wrap box-style\">\n                                                                                                <li class=\"view-details\" title=\"Details\"><a href=\"https:\/\/novo.mosal.com.br\/?product=abracadeira\"><i class=\"fas fa-link\"><\/i><\/a><\/li>\n                    <\/ul>\n                                    <\/div>\n            <\/div>\n            <div class=\"product-details-wrap\">\n                <div class=\"product-details\">\n                    <div class=\"eael-product-title\"><h4>Abra\u00e7adeira<\/h4><\/div>\n                <\/div>\n                            <\/div>\n        <\/div>\n\t<\/div>\n    <\/div><\/div>            <!-- Add Pagination -->\n            <div class=\"swiper-pagination swiper-pagination-6212b25 dots-preset-1\"><\/div>\n                <\/div>\n        \t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2e158200 e-con-full e-flex e-con e-child\" data-id=\"2e158200\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-186bc107 elementor-widget elementor-widget-text-editor\" data-id=\"186bc107\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Uma linha completa de pe\u00e7as para ventila\u00e7\u00e3o, exaust\u00e3o e instala\u00e7\u00f5es, com a qualidade Mosal..<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-75b03979 e-flex e-con-boxed e-con e-parent\" data-id=\"75b03979\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-36b5346 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"36b5346\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/novo.mosal.com.br\/?page_id=75\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Conhe\u00e7a todos os nossos produtos<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-48158302 e-con-full e-flex e-con e-parent\" data-id=\"48158302\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-38190892 elementor-widget elementor-widget-html\" data-id=\"38190892\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SE\u00c7\u00c3O MOSAL \u2014 VANTAGENS -->\n<style>\n  .mosal-vantagens,\n  .mosal-vantagens * {\n    box-sizing: border-box;\n  }\n\n  .mosal-vantagens {\n    --mosal-azul: #0878f9;\n    --mosal-azul-claro: #69b8ff;\n    --mosal-marinho: #021c35;\n    --mosal-marinho-card: #07559d;\n    --mosal-branco: #ffffff;\n    --mosal-texto: #d2deea;\n    position: relative;\n    overflow: hidden;\n    width: 100%;\n    padding: clamp(72px, 8vw, 128px) clamp(24px, 6vw, 96px);\n    color: var(--mosal-branco);\n    background:\n      radial-gradient(circle at 74% 35%, rgba(9, 101, 184, .35), transparent 38%),\n      linear-gradient(115deg, #01172c 0%, var(--mosal-marinho) 52%, #032746 100%);\n    font-family: Arial, Helvetica, sans-serif;\n  }\n\n  .mosal-vantagens::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n    opacity: .20;\n    background-image:\n      linear-gradient(rgba(121, 185, 239, .12) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(121, 185, 239, .10) 1px, transparent 1px);\n    background-size: 70px 70px;\n    mask-image: linear-gradient(90deg, transparent, #000 60%);\n  }\n\n  .mosal-vantagens__conteudo {\n    position: relative;\n    z-index: 1;\n    width: min(1440px, 100%);\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr);\n    gap: clamp(38px, 5vw, 82px);\n    align-items: center;\n  }\n\n  .mosal-vantagens__chamada {\n    align-self: center;\n    min-width: 0;\n  }\n\n  .mosal-vantagens__etiqueta {\n    margin: 0 0 22px;\n    color: #9acbff;\n    font-size: .72rem;\n    font-weight: 800;\n    line-height: 1.4;\n    letter-spacing: .28em;\n    text-transform: uppercase;\n  }\n\n  .mosal-vantagens__titulo {\n    max-width: 390px;\n    margin: 0;\n    font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    font-weight: 850;\n    line-height: .92;\n    letter-spacing: -.055em;\n    text-wrap: balance;\n    overflow-wrap: break-word;\n  }\n\n  .mosal-vantagens__cards {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: clamp(16px, 1.8vw, 28px);\n  }\n\n  .mosal-vantagem-card {\n    position: relative;\n    min-height: 440px;\n    overflow: hidden;\n    isolation: isolate;\n    padding: 34px 30px;\n    border: 1px solid rgba(124, 196, 255, .20);\n    border-radius: 16px;\n    background: var(--mosal-marinho-card);\n    box-shadow: 0 22px 48px rgba(0, 10, 26, .30);\n    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;\n  }\n\n  .mosal-vantagem-card:hover {\n    transform: translateY(-8px);\n    border-color: rgba(124, 196, 255, .48);\n    box-shadow: 0 30px 60px rgba(0, 10, 26, .48);\n  }\n\n  .mosal-vantagem-card__imagem {\n    position: absolute;\n    z-index: -2;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    transition: transform .45s ease;\n  }\n\n  .mosal-vantagem-card:hover .mosal-vantagem-card__imagem {\n    transform: scale(1.055);\n  }\n\n  .mosal-vantagem-card::after {\n    content: \"\";\n    position: absolute;\n    z-index: -1;\n    inset: 0;\n    background:\n      linear-gradient(180deg, rgba(1, 31, 58, .22) 0%, rgba(1, 28, 53, .38) 36%, rgba(1, 20, 39, .94) 100%),\n      linear-gradient(135deg, rgba(8, 120, 249, .52), transparent 55%);\n  }\n\n  .mosal-vantagem-card__icone {\n    width: 46px;\n    height: 46px;\n    margin-bottom: 24px;\n    display: grid;\n    place-items: center;\n    border: 1px solid rgba(105, 184, 255, .72);\n    border-radius: 50%;\n    color: var(--mosal-azul-claro);\n    font-size: 1.2rem;\n    font-weight: 800;\n  }\n\n  .mosal-vantagem-card__titulo {\n    max-width: 230px;\n    margin: 0 0 14px;\n    font-size: clamp(1.35rem, 1.65vw, 1.9rem);\n    font-weight: 800;\n    line-height: 1.06;\n    letter-spacing: -.025em;\n  }\n\n  .mosal-vantagem-card__texto {\n    max-width: 240px;\n    margin: 0;\n    color: var(--mosal-texto);\n    font-size: .94rem;\n    line-height: 1.55;\n  }\n\n  @media (max-width: 1200px) {\n    .mosal-vantagens__conteudo {\n      grid-template-columns: 1fr;\n    }\n\n    .mosal-vantagens__titulo {\n      max-width: 650px;\n      font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    }\n\n    .mosal-vantagem-card {\n      min-height: 390px;\n    }\n  }\n\n  @media (max-width: 760px) {\n    .mosal-vantagens {\n      padding: 72px 22px;\n    }\n\n    .mosal-vantagens__cards {\n      grid-template-columns: 1fr;\n    }\n\n    .mosal-vantagem-card {\n      min-height: 380px;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .mosal-vantagem-card,\n    .mosal-vantagem-card__imagem {\n      transition: none;\n    }\n  }\n<\/style>\n\n<section class=\"mosal-vantagens\" aria-labelledby=\"mosal-vantagens-titulo\">\n  <div class=\"mosal-vantagens__conteudo\">\n    <header class=\"mosal-vantagens__chamada\">\n      <p class=\"mosal-vantagens__etiqueta\">Por que escolher a Mosal<\/p>\n      <h2 class=\"mosal-vantagens__titulo\" id=\"mosal-vantagens-titulo\">\n        Vantagens que fazem a diferen\u00e7a.\n      <\/h2>\n    <\/header>\n\n    <div class=\"mosal-vantagens__cards\">\n      <article class=\"mosal-vantagem-card\">\n        <!-- Troque o endere\u00e7o abaixo pela imagem enviada ao WordPress (enquanto n\u00e3o houver imagem, o card mostra s\u00f3 o fundo azul) -->\n        <img decoding=\"async\" class=\"mosal-vantagem-card__imagem\" onerror=\"this.style.display='none'\" src=\"IMAGEM-QUALIDADE.jpg\" alt=\"Pe\u00e7a Mosal em alum\u00ednio com acabamento de alta precis\u00e3o\">\n        <span class=\"mosal-vantagem-card__icone\" aria-hidden=\"true\">\u2713<\/span>\n        <h3 class=\"mosal-vantagem-card__titulo\">Qualidade comprovada<\/h3>\n        <p class=\"mosal-vantagem-card__texto\">Processos rigorosos e alto padr\u00e3o em cada pe\u00e7a.<\/p>\n      <\/article>\n\n      <article class=\"mosal-vantagem-card\">\n        <!-- Troque o endere\u00e7o abaixo pela imagem enviada ao WordPress (enquanto n\u00e3o houver imagem, o card mostra s\u00f3 o fundo azul) -->\n        <img decoding=\"async\" class=\"mosal-vantagem-card__imagem\" onerror=\"this.style.display='none'\" src=\"IMAGEM-SOB-MEDIDA.jpg\" alt=\"Tubo flex\u00edvel de alum\u00ednio produzido pela Mosal\">\n        <span class=\"mosal-vantagem-card__icone\" aria-hidden=\"true\">\u2726<\/span>\n        <h3 class=\"mosal-vantagem-card__titulo\">Solu\u00e7\u00f5es sob medida<\/h3>\n        <p class=\"mosal-vantagem-card__texto\">Pe\u00e7as que se adaptam a diferentes projetos e necessidades.<\/p>\n      <\/article>\n\n      <article class=\"mosal-vantagem-card\">\n        <!-- Troque o endere\u00e7o abaixo pela imagem enviada ao WordPress (enquanto n\u00e3o houver imagem, o card mostra s\u00f3 o fundo azul) -->\n        <img decoding=\"async\" class=\"mosal-vantagem-card__imagem\" onerror=\"this.style.display='none'\" src=\"IMAGEM-EFICIENCIA.jpg\" alt=\"Superf\u00edcie de alum\u00ednio recicl\u00e1vel utilizada nos produtos Mosal\">\n        <span class=\"mosal-vantagem-card__icone\" aria-hidden=\"true\">\u267b<\/span>\n        <h3 class=\"mosal-vantagem-card__titulo\">Mais efici\u00eancia e sustentabilidade<\/h3>\n        <p class=\"mosal-vantagem-card__texto\">O alum\u00ednio \u00e9 dur\u00e1vel, recicl\u00e1vel e um aliado do futuro.<\/p>\n      <\/article>\n    <\/div>\n  <\/div>\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-15be1a60 e-flex e-con-boxed e-con e-parent\" data-id=\"15be1a60\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4c9548da elementor-widget elementor-widget-html\" data-id=\"4c9548da\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\n     SE\u00c7\u00c3O MOSAL \u2014 INFORMA\u00c7\u00d5ES T\u00c9CNICAS\r\n     Pode ser colada inteira em um widget HTML do Elementor.\r\n     ========================================================= -->\r\n\r\n<style>\r\n  \/* =========================================================\r\n     1. CORES E CONFIGURA\u00c7\u00d5ES GERAIS\r\n     Altere as cores somente neste bloco.\r\n     ========================================================= *\/\r\n  .mosal-tecnica,\r\n  .mosal-tecnica * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .mosal-tecnica {\r\n    --mosal-azul: #0878f9;\r\n    --mosal-azul-hover: #0069e0;\r\n    --mosal-marinho: #021c35;\r\n    --mosal-titulo: #071f38;\r\n    --mosal-texto: #55697c;\r\n    --mosal-fundo: #edf4f8;\r\n    --mosal-branco: #ffffff;\r\n    --mosal-linha: #d9e4eb;\r\n    width: 100%;\r\n    padding: clamp(72px, 8vw, 128px) clamp(24px, 6vw, 96px);\r\n    background:\r\n      radial-gradient(circle at 15% 70%, rgba(8, 120, 249, .08), transparent 32%),\r\n      linear-gradient(115deg, #f7fafc 0%, var(--mosal-fundo) 100%);\r\n    color: var(--mosal-titulo);\r\n    font-family: Arial, Helvetica, sans-serif;\r\n  }\r\n\r\n  \/* =========================================================\r\n     2. ESTRUTURA DA SE\u00c7\u00c3O\r\n     Coluna esquerda: chamada e bot\u00e3o.\r\n     Coluna direita: acorde\u00e3o.\r\n     ========================================================= *\/\r\n  .mosal-tecnica__conteudo {\r\n    width: min(1440px, 100%);\r\n    margin: 0 auto;\r\n    display: grid;\r\n    grid-template-columns: minmax(290px, .88fr) minmax(480px, 1.12fr);\r\n    gap: clamp(48px, 8vw, 130px);\r\n    align-items: center;\r\n  }\r\n\r\n  \/* =========================================================\r\n     3. COLUNA DE TEXTO\r\n     ========================================================= *\/\r\n  .mosal-tecnica__etiqueta {\r\n    margin: 0 0 22px;\r\n    color: #397aad;\r\n    font-size: .72rem;\r\n    font-weight: 800;\r\n    line-height: 1.4;\r\n    letter-spacing: .28em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .mosal-tecnica__titulo {\r\n    max-width: 610px;\r\n    margin: 0;\r\n    font-size: clamp(2.3rem, 3.5vw, 4.3rem);\r\n    overflow-wrap: break-word;\r\n    font-weight: 850;\r\n    line-height: .90;\r\n    letter-spacing: -.062em;\r\n    text-wrap: balance;\r\n  }\r\n\r\n  .mosal-tecnica__texto {\r\n    max-width: 560px;\r\n    margin: 30px 0 0;\r\n    color: var(--mosal-texto);\r\n    font-size: 1rem;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .mosal-tecnica__botao {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 15px;\r\n    margin-top: 34px;\r\n    padding: 17px 24px;\r\n    border-radius: 999px;\r\n    background: var(--mosal-azul);\r\n    box-shadow: 0 12px 28px rgba(0, 108, 228, .22);\r\n    color: var(--mosal-branco);\r\n    font-size: .78rem;\r\n    font-weight: 800;\r\n    text-decoration: none;\r\n    transition: transform .2s ease, background-color .2s ease;\r\n  }\r\n\r\n  .mosal-tecnica__botao:hover {\r\n    background: var(--mosal-azul-hover);\r\n    transform: translateY(-2px);\r\n  }\r\n\r\n  .mosal-tecnica__botao-seta {\r\n    font-size: 1.1rem;\r\n  }\r\n\r\n  \/* =========================================================\r\n     4. ACORDE\u00c3O \u2014 ESTRUTURA GERAL\r\n     Cada .mosal-acordeao__item corresponde a uma aba.\r\n     ========================================================= *\/\r\n  .mosal-acordeao {\r\n    display: grid;\r\n    gap: 12px;\r\n  }\r\n\r\n  .mosal-acordeao__item {\r\n    overflow: hidden;\r\n    border: 1px solid rgba(7, 31, 56, .07);\r\n    border-radius: 12px;\r\n    background: var(--mosal-branco);\r\n    box-shadow: 0 10px 28px rgba(7, 31, 56, .055);\r\n  }\r\n\r\n  \/* Linha clic\u00e1vel de cada aba *\/\r\n  .mosal-acordeao__cabecalho {\r\n    position: relative;\r\n    min-height: 78px;\r\n    padding: 21px 72px 21px 25px;\r\n    display: grid;\r\n    grid-template-columns: 42px minmax(0, 1fr);\r\n    gap: 16px;\r\n    align-items: center;\r\n    cursor: pointer;\r\n    list-style: none;\r\n  }\r\n\r\n  .mosal-acordeao__cabecalho::-webkit-details-marker {\r\n    display: none;\r\n  }\r\n\r\n  .mosal-acordeao__numero {\r\n    color: #426984;\r\n    font-size: .72rem;\r\n    font-weight: 800;\r\n  }\r\n\r\n  .mosal-acordeao__titulo {\r\n    color: var(--mosal-titulo);\r\n    font-size: .98rem;\r\n    font-weight: 800;\r\n    line-height: 1.3;\r\n  }\r\n\r\n  \/* Sinal de + ou \u2212 no lado direito *\/\r\n  .mosal-acordeao__icone {\r\n    position: absolute;\r\n    top: 50%;\r\n    right: 26px;\r\n    width: 26px;\r\n    height: 26px;\r\n    transform: translateY(-50%);\r\n  }\r\n\r\n  .mosal-acordeao__icone::before,\r\n  .mosal-acordeao__icone::after {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    width: 15px;\r\n    height: 2px;\r\n    border-radius: 2px;\r\n    background: var(--mosal-azul);\r\n    transform: translate(-50%, -50%);\r\n    transition: transform .22s ease, opacity .22s ease;\r\n  }\r\n\r\n  .mosal-acordeao__icone::after {\r\n    transform: translate(-50%, -50%) rotate(90deg);\r\n  }\r\n\r\n  .mosal-acordeao__item[open] .mosal-acordeao__icone::after {\r\n    opacity: 0;\r\n    transform: translate(-50%, -50%) rotate(0deg);\r\n  }\r\n\r\n  .mosal-acordeao__item[open] .mosal-acordeao__cabecalho {\r\n    padding-bottom: 15px;\r\n  }\r\n\r\n  \/* \u00c1rea do texto revelado ao abrir uma aba *\/\r\n  .mosal-acordeao__resposta {\r\n    margin: 0 25px 0 83px;\r\n    padding: 0 42px 26px 0;\r\n    border-top: 1px solid var(--mosal-linha);\r\n  }\r\n\r\n  .mosal-acordeao__resposta p {\r\n    margin: 18px 0 0;\r\n    color: var(--mosal-texto);\r\n    font-size: .92rem;\r\n    line-height: 1.65;\r\n  }\r\n\r\n  \/* Lista opcional dentro da resposta *\/\r\n  .mosal-acordeao__lista {\r\n    margin: 16px 0 0;\r\n    padding-left: 18px;\r\n    color: var(--mosal-texto);\r\n    font-size: .9rem;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  \/* =========================================================\r\n     5. TABLET E CELULAR\r\n     ========================================================= *\/\r\n  @media (max-width: 980px) {\r\n    .mosal-tecnica__conteudo {\r\n      grid-template-columns: 1fr;\r\n    }\r\n\r\n    .mosal-tecnica__titulo {\r\n      max-width: 700px;\r\n    }\r\n  }\r\n\r\n  @media (max-width: 600px) {\r\n    .mosal-tecnica {\r\n      padding: 70px 22px;\r\n    }\r\n\r\n    .mosal-tecnica__titulo {\r\n      font-size: clamp(2.3rem, 3.5vw, 4.3rem);\r\n    }\r\n\r\n    .mosal-acordeao__cabecalho {\r\n      min-height: 72px;\r\n      padding: 18px 56px 18px 18px;\r\n      grid-template-columns: 30px minmax(0, 1fr);\r\n      gap: 10px;\r\n    }\r\n\r\n    .mosal-acordeao__icone {\r\n      right: 17px;\r\n    }\r\n\r\n    .mosal-acordeao__resposta {\r\n      margin: 0 18px 0 58px;\r\n      padding-right: 0;\r\n    }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .mosal-tecnica__botao,\r\n    .mosal-acordeao__icone::before,\r\n    .mosal-acordeao__icone::after {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<!-- =========================================================\r\n     6. CONTE\u00daDO DA SE\u00c7\u00c3O\r\n     EDITE OS TEXTOS SOMENTE DAQUI PARA BAIXO.\r\n     ========================================================= -->\r\n<section class=\"mosal-tecnica\" aria-labelledby=\"mosal-tecnica-titulo\">\r\n  <div class=\"mosal-tecnica__conteudo\">\r\n\r\n    <!-- =====================================================\r\n         COLUNA ESQUERDA \u2014 CHAMADA DA SE\u00c7\u00c3O\r\n         ===================================================== -->\r\n    <header class=\"mosal-tecnica__chamada\">\r\n\r\n      <!-- ETIQUETA PEQUENA -->\r\n      <p class=\"mosal-tecnica__etiqueta\">Ficha t\u00e9cnica<\/p>\r\n\r\n      <!-- T\u00cdTULO PRINCIPAL -->\r\n      <h2 class=\"mosal-tecnica__titulo\" id=\"mosal-tecnica-titulo\">\r\n        Informa\u00e7\u00e3o t\u00e9cnica, de forma simples e objetiva.\r\n      <\/h2>\r\n\r\n      <!-- TEXTO DE APRESENTA\u00c7\u00c3O -->\r\n      <p class=\"mosal-tecnica__texto\">\r\n        Encontre as especifica\u00e7\u00f5es, medidas, materiais e orienta\u00e7\u00f5es de uso dos nossos produtos em um s\u00f3 lugar.\r\n      <\/p>\r\n\r\n      <!-- BOT\u00c3O: altere o texto e o link href -->\r\n      <a class=\"mosal-tecnica__botao\" href=\"https:\/\/novo.mosal.com.br\/?page_id=75\">\r\n        <span>Acessar nossos produtos<\/span>\r\n        <span class=\"mosal-tecnica__botao-seta\" aria-hidden=\"true\">\u2192<\/span>\r\n      <\/a>\r\n    <\/header>\r\n\r\n    <!-- =====================================================\r\n         COLUNA DIREITA \u2014 ACORDE\u00c3O\r\n         Para criar outra aba, copie um bloco <details> inteiro.\r\n         Para deixar uma aba aberta inicialmente, adicione: open\r\n         Exemplo: <details class=\"mosal-acordeao__item\" open>\r\n         ===================================================== -->\r\n    <div class=\"mosal-acordeao\">\r\n\r\n      <!-- ===================================================\r\n           ABA 01 \u2014 MATERIAIS E COMPOSI\u00c7\u00c3O\r\n           =================================================== -->\r\n      <details class=\"mosal-acordeao__item\" open>\r\n        <summary class=\"mosal-acordeao__cabecalho\">\r\n          <!-- N\u00daMERO DA ABA 01 -->\r\n          <span class=\"mosal-acordeao__numero\">01<\/span>\r\n\r\n          <!-- T\u00cdTULO DA ABA 01 -->\r\n          <span class=\"mosal-acordeao__titulo\">Materiais e composi\u00e7\u00e3o<\/span>\r\n\r\n          <!-- \u00cdCONE +\/\u2212: n\u00e3o alterar -->\r\n          <span class=\"mosal-acordeao__icone\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n\r\n        <!-- TEXTO INTERNO DA ABA 01 -->\r\n        <div class=\"mosal-acordeao__resposta\">\r\n          <p>\r\n            Nossos produtos s\u00e3o fabricados em alum\u00ednio de alta pureza, com excelente resist\u00eancia, durabilidade e acabamento.\r\n          <\/p>\r\n\r\n          <!-- LISTA OPCIONAL DA ABA 01: apague se n\u00e3o precisar -->\r\n          <ul class=\"mosal-acordeao__lista\">\r\n            <li>Alum\u00ednio leve, resistente e recicl\u00e1vel.<\/li>\r\n            <li>Acabamento adequado a diferentes aplica\u00e7\u00f5es.<\/li>\r\n          <\/ul>\r\n        <\/div>\r\n      <\/details>\r\n      <!-- FIM DA ABA 01 -->\r\n\r\n      <!-- ===================================================\r\n           ABA 02 \u2014 MEDIDAS E APLICA\u00c7\u00d5ES\r\n           =================================================== -->\r\n      <details class=\"mosal-acordeao__item\">\r\n        <summary class=\"mosal-acordeao__cabecalho\">\r\n          <!-- N\u00daMERO DA ABA 02 -->\r\n          <span class=\"mosal-acordeao__numero\">02<\/span>\r\n\r\n          <!-- T\u00cdTULO DA ABA 02 -->\r\n          <span class=\"mosal-acordeao__titulo\">Medidas e aplica\u00e7\u00f5es<\/span>\r\n\r\n          <!-- \u00cdCONE +\/\u2212: n\u00e3o alterar -->\r\n          <span class=\"mosal-acordeao__icone\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n\r\n        <!-- TEXTO INTERNO DA ABA 02 -->\r\n        <div class=\"mosal-acordeao__resposta\">\r\n          <p>\r\n            Consulte as dimens\u00f5es dispon\u00edveis e encontre a pe\u00e7a adequada para cada projeto de ventila\u00e7\u00e3o, exaust\u00e3o ou instala\u00e7\u00e3o.\r\n          <\/p>\r\n\r\n          <!-- LISTA OPCIONAL DA ABA 02: apague se n\u00e3o precisar -->\r\n          <ul class=\"mosal-acordeao__lista\">\r\n            <li>Diferentes di\u00e2metros e formatos.<\/li>\r\n            <li>Aplica\u00e7\u00f5es residenciais, comerciais e industriais.<\/li>\r\n          <\/ul>\r\n        <\/div>\r\n      <\/details>\r\n      <!-- FIM DA ABA 02 -->\r\n\r\n      <!-- ===================================================\r\n           ABA 03 \u2014 NORMAS E CERTIFICA\u00c7\u00d5ES\r\n           =================================================== -->\r\n      <details class=\"mosal-acordeao__item\">\r\n        <summary class=\"mosal-acordeao__cabecalho\">\r\n          <!-- N\u00daMERO DA ABA 03 -->\r\n          <span class=\"mosal-acordeao__numero\">03<\/span>\r\n\r\n          <!-- T\u00cdTULO DA ABA 03 -->\r\n          <span class=\"mosal-acordeao__titulo\">Normas e certifica\u00e7\u00f5es<\/span>\r\n\r\n          <!-- \u00cdCONE +\/\u2212: n\u00e3o alterar -->\r\n          <span class=\"mosal-acordeao__icone\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n\r\n        <!-- TEXTO INTERNO DA ABA 03 -->\r\n        <div class=\"mosal-acordeao__resposta\">\r\n          <p>\r\n            Inclua aqui as normas t\u00e9cnicas, certifica\u00e7\u00f5es e padr\u00f5es de qualidade aplic\u00e1veis aos produtos da Mosal.\r\n          <\/p>\r\n\r\n          <!-- LISTA OPCIONAL DA ABA 03: apague se n\u00e3o precisar -->\r\n          <ul class=\"mosal-acordeao__lista\">\r\n            <li>Norma ou certifica\u00e7\u00e3o 01.<\/li>\r\n            <li>Norma ou certifica\u00e7\u00e3o 02.<\/li>\r\n          <\/ul>\r\n        <\/div>\r\n      <\/details>\r\n      <!-- FIM DA ABA 03 -->\r\n\r\n      <!-- ===================================================\r\n           ABA 04 \u2014 INSTALA\u00c7\u00c3O E MANUTEN\u00c7\u00c3O\r\n           =================================================== -->\r\n      <details class=\"mosal-acordeao__item\">\r\n        <summary class=\"mosal-acordeao__cabecalho\">\r\n          <!-- N\u00daMERO DA ABA 04 -->\r\n          <span class=\"mosal-acordeao__numero\">04<\/span>\r\n\r\n          <!-- T\u00cdTULO DA ABA 04 -->\r\n          <span class=\"mosal-acordeao__titulo\">Instala\u00e7\u00e3o e manuten\u00e7\u00e3o<\/span>\r\n\r\n          <!-- \u00cdCONE +\/\u2212: n\u00e3o alterar -->\r\n          <span class=\"mosal-acordeao__icone\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n\r\n        <!-- TEXTO INTERNO DA ABA 04 -->\r\n        <div class=\"mosal-acordeao__resposta\">\r\n          <p>\r\n            Re\u00fana neste espa\u00e7o as orienta\u00e7\u00f5es de instala\u00e7\u00e3o, limpeza, conserva\u00e7\u00e3o e manuten\u00e7\u00e3o dos produtos.\r\n          <\/p>\r\n\r\n          <!-- LISTA OPCIONAL DA ABA 04: apague se n\u00e3o precisar -->\r\n          <ul class=\"mosal-acordeao__lista\">\r\n            <li>Orienta\u00e7\u00e3o de instala\u00e7\u00e3o.<\/li>\r\n            <li>Recomenda\u00e7\u00e3o de manuten\u00e7\u00e3o e conserva\u00e7\u00e3o.<\/li>\r\n          <\/ul>\r\n        <\/div>\r\n      <\/details>\r\n      <!-- FIM DA ABA 04 -->\r\n\r\n    <\/div>\r\n    <!-- FIM DO ACORDE\u00c3O -->\r\n\r\n  <\/div>\r\n<\/section>\r\n<!-- FIM DA SE\u00c7\u00c3O MOSAL \u2014 INFORMA\u00c7\u00d5ES T\u00c9CNICAS -->\r\n\r\n<script>\r\n  \/* =========================================================\r\n     7. COMPORTAMENTO DO ACORDE\u00c3O\r\n     Mant\u00e9m somente uma aba aberta por vez.\r\n     N\u00e3o \u00e9 necess\u00e1rio alterar este bloco.\r\n     ========================================================= *\/\r\n  document.querySelectorAll('.mosal-acordeao').forEach(function (acordeao) {\r\n    const abas = acordeao.querySelectorAll('.mosal-acordeao__item');\r\n\r\n    abas.forEach(function (abaAtual) {\r\n      abaAtual.addEventListener('toggle', function () {\r\n        if (!abaAtual.open) return;\r\n\r\n        abas.forEach(function (outraAba) {\r\n          if (outraAba !== abaAtual) outraAba.open = false;\r\n        });\r\n      });\r\n    });\r\n  });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2554087e e-con-full e-flex e-con e-parent\" data-id=\"2554087e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4d028faa elementor-widget elementor-widget-html\" data-id=\"4d028faa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\n     SE\u00c7\u00c3O MOSAL \u2014 GRANDES PARCEIROS\r\n     Cole o c\u00f3digo inteiro em um widget HTML do Elementor.\r\n     ========================================================= -->\r\n\r\n<style>\r\n  \/* =========================================================\r\n     1. CORES E CONFIGURA\u00c7\u00d5ES GERAIS\r\n     ========================================================= *\/\r\n  .mosal-parceiros,\r\n  .mosal-parceiros * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .mosal-parceiros {\r\n    --mosal-azul: #0878f9;\r\n    --mosal-azul-claro: #69b8ff;\r\n    --mosal-marinho: #021c35;\r\n    --mosal-branco: #ffffff;\r\n    --mosal-texto: #d2deea;\r\n    position: relative;\r\n    overflow: hidden;\r\n    width: 100%;\r\n    padding: clamp(68px, 7vw, 108px) clamp(24px, 6vw, 96px);\r\n    background:\r\n      radial-gradient(circle at 70% 50%, rgba(8, 120, 249, .20), transparent 42%),\r\n      linear-gradient(105deg, #01172c 0%, var(--mosal-marinho) 58%, #032846 100%);\r\n    color: var(--mosal-branco);\r\n    font-family: Arial, Helvetica, sans-serif;\r\n  }\r\n\r\n  .mosal-parceiros::before {\r\n    content: \"\";\r\n    position: absolute;\r\n    inset: 0;\r\n    pointer-events: none;\r\n    opacity: .17;\r\n    background-image:\r\n      linear-gradient(rgba(121, 185, 239, .12) 1px, transparent 1px),\r\n      linear-gradient(90deg, rgba(121, 185, 239, .10) 1px, transparent 1px);\r\n    background-size: 70px 70px;\r\n    mask-image: linear-gradient(90deg, transparent 10%, #000 70%);\r\n  }\r\n\r\n  \/* =========================================================\r\n     2. ESTRUTURA DA SE\u00c7\u00c3O\r\n     ========================================================= *\/\r\n  .mosal-parceiros__conteudo {\r\n    position: relative;\r\n    z-index: 1;\r\n    width: min(1440px, 100%);\r\n    margin: 0 auto;\r\n    display: grid;\r\n    grid-template-columns: minmax(250px, .72fr) minmax(0, 2.28fr);\r\n    gap: clamp(40px, 6vw, 95px);\r\n    align-items: center;\r\n  }\r\n\r\n  \/* =========================================================\r\n     3. T\u00cdTULO \u00c0 ESQUERDA\r\n     ========================================================= *\/\r\n  .mosal-parceiros__etiqueta {\r\n    margin: 0 0 20px;\r\n    color: #9acbff;\r\n    font-size: .72rem;\r\n    font-weight: 800;\r\n    line-height: 1.4;\r\n    letter-spacing: .28em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .mosal-parceiros__titulo {\r\n    max-width: 430px;\r\n    margin: 0;\r\n    font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    overflow-wrap: break-word;\r\n    font-weight: 850;\r\n    line-height: .92;\r\n    letter-spacing: -.055em;\r\n    text-wrap: balance;\r\n  }\r\n\r\n  \/* =========================================================\r\n     4. \u00c1REA DO CARROSSEL\r\n     ========================================================= *\/\r\n  .mosal-carrossel {\r\n    min-width: 0;\r\n  }\r\n\r\n  .mosal-carrossel__janela {\r\n    overflow: hidden;\r\n    width: 100%;\r\n    mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);\r\n  }\r\n\r\n  .mosal-carrossel__trilho {\r\n    display: flex;\r\n    align-items: stretch;\r\n    gap: 16px;\r\n    transform: translateX(0);\r\n    transition: transform .45s cubic-bezier(.2, .7, .2, 1);\r\n    will-change: transform;\r\n  }\r\n\r\n  \/* Cada .mosal-parceiro representa um parceiro *\/\r\n  .mosal-parceiro {\r\n    flex: 0 0 calc((100% - 32px) \/ 3);\r\n    min-width: 0;\r\n    height: 150px;\r\n    padding: 25px;\r\n    display: grid;\r\n    place-items: center;\r\n    border: 1px solid rgba(142, 198, 246, .20);\r\n    border-radius: 12px;\r\n    background: rgba(255, 255, 255, .055);\r\n    backdrop-filter: blur(8px);\r\n    transition: background-color .25s ease, border-color .25s ease, transform .25s ease;\r\n  }\r\n\r\n  .mosal-parceiro:hover {\r\n    transform: translateY(-4px);\r\n    border-color: rgba(142, 198, 246, .50);\r\n    background: rgba(255, 255, 255, .095);\r\n  }\r\n\r\n  \/* Espa\u00e7o reservado para a imagem real de cada logo *\/\r\n  .mosal-parceiro__logo {\r\n    display: block;\r\n    width: 100%;\r\n    max-width: 175px;\r\n    height: 72px;\r\n    object-fit: contain;\r\n    filter: grayscale(1) brightness(0) invert(1);\r\n  }\r\n\r\n  \/* Nome tempor\u00e1rio exibido enquanto a imagem n\u00e3o estiver cadastrada *\/\r\n  .mosal-parceiro__nome {\r\n    display: none;\r\n    color: var(--mosal-branco);\r\n    font-size: clamp(1.15rem, 1.6vw, 1.65rem);\r\n    font-weight: 800;\r\n    line-height: 1.1;\r\n    letter-spacing: -.025em;\r\n    text-align: center;\r\n  }\r\n\r\n  .mosal-parceiro.sem-imagem .mosal-parceiro__logo {\r\n    display: none;\r\n  }\r\n\r\n  .mosal-parceiro.sem-imagem .mosal-parceiro__nome {\r\n    display: block;\r\n  }\r\n\r\n  \/* =========================================================\r\n     5. BOT\u00d5ES DO CARROSSEL\r\n     ========================================================= *\/\r\n  .mosal-carrossel__controles {\r\n    margin-top: 24px;\r\n    display: flex;\r\n    justify-content: flex-end;\r\n    gap: 10px;\r\n  }\r\n\r\n  .mosal-carrossel__botao {\r\n    width: 46px;\r\n    height: 46px;\r\n    padding: 0;\r\n    display: grid;\r\n    place-items: center;\r\n    border: 1px solid rgba(105, 184, 255, .48);\r\n    border-radius: 50%;\r\n    background: transparent;\r\n    color: var(--mosal-branco);\r\n    font: inherit;\r\n    font-size: 1.15rem;\r\n    cursor: pointer;\r\n    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;\r\n  }\r\n\r\n  .mosal-carrossel__botao:hover {\r\n    border-color: var(--mosal-azul);\r\n    background: var(--mosal-azul);\r\n    transform: translateY(-2px);\r\n  }\r\n\r\n  .mosal-carrossel__botao:focus-visible {\r\n    outline: 3px solid rgba(105, 184, 255, .50);\r\n    outline-offset: 3px;\r\n  }\r\n\r\n  \/* =========================================================\r\n     6. TABLET E CELULAR\r\n     ========================================================= *\/\r\n  @media (max-width: 980px) {\r\n    .mosal-parceiros__conteudo {\r\n      grid-template-columns: 1fr;\r\n    }\r\n\r\n    .mosal-parceiro {\r\n      flex-basis: calc((100% - 16px) \/ 2);\r\n    }\r\n  }\r\n\r\n  @media (max-width: 600px) {\r\n    .mosal-parceiros {\r\n      padding: 70px 22px;\r\n    }\r\n\r\n    .mosal-parceiro {\r\n      flex-basis: 100%;\r\n      height: 140px;\r\n    }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .mosal-carrossel__trilho,\r\n    .mosal-parceiro,\r\n    .mosal-carrossel__botao {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<!-- =========================================================\r\n     7. CONTE\u00daDO DA SE\u00c7\u00c3O\r\n     EDITE OS NOMES E AS IMAGENS DAQUI PARA BAIXO.\r\n     ========================================================= -->\r\n<section class=\"mosal-parceiros\" aria-labelledby=\"mosal-parceiros-titulo\">\r\n  <div class=\"mosal-parceiros__conteudo\">\r\n\r\n    <!-- COLUNA ESQUERDA \u2014 T\u00cdTULO -->\r\n    <header class=\"mosal-parceiros__chamada\">\r\n      <!-- ETIQUETA PEQUENA -->\r\n      <p class=\"mosal-parceiros__etiqueta\">Confian\u00e7a que constr\u00f3i<\/p>\r\n\r\n      <!-- T\u00cdTULO PRINCIPAL -->\r\n      <h2 class=\"mosal-parceiros__titulo\" id=\"mosal-parceiros-titulo\">\r\n        Grandes parceiros, novos horizontes.\r\n      <\/h2>\r\n    <\/header>\r\n\r\n    <!-- COLUNA DIREITA \u2014 CARROSSEL -->\r\n    <div class=\"mosal-carrossel\" data-mosal-carrossel>\r\n      <div class=\"mosal-carrossel__janela\">\r\n        <div class=\"mosal-carrossel__trilho\">\r\n\r\n          <!-- ===============================================\r\n               PARCEIRO 01 \u2014 MRV\r\n               Troque LOGO-MRV.png pela URL da imagem no site.\r\n               =============================================== -->\r\n          <article class=\"mosal-parceiro\">\r\n            <img decoding=\"async\" class=\"mosal-parceiro__logo\" src=\"LOGO-MRV.png\" alt=\"MRV\">\r\n            <span class=\"mosal-parceiro__nome\">MRV<\/span>\r\n          <\/article>\r\n          <!-- FIM DO PARCEIRO 01 -->\r\n\r\n          <!-- ===============================================\r\n               PARCEIRO 02 \u2014 RACIONAL ENGENHARIA\r\n               Troque LOGO-RACIONAL.png pela URL da imagem no site.\r\n               =============================================== -->\r\n          <article class=\"mosal-parceiro\">\r\n            <img decoding=\"async\" class=\"mosal-parceiro__logo\" src=\"LOGO-RACIONAL.png\" alt=\"Racional Engenharia\">\r\n            <span class=\"mosal-parceiro__nome\">Racional<br>Engenharia<\/span>\r\n          <\/article>\r\n          <!-- FIM DO PARCEIRO 02 -->\r\n\r\n          <!-- ===============================================\r\n               PARCEIRO 03 \u2014 TENDA\r\n               Troque LOGO-TENDA.png pela URL da imagem no site.\r\n               =============================================== -->\r\n          <article class=\"mosal-parceiro\">\r\n            <img decoding=\"async\" class=\"mosal-parceiro__logo\" src=\"LOGO-TENDA.png\" alt=\"Tenda\">\r\n            <span class=\"mosal-parceiro__nome\">Tenda<\/span>\r\n          <\/article>\r\n          <!-- FIM DO PARCEIRO 03 -->\r\n\r\n          <!-- ===============================================\r\n               PARCEIRO 04 \u2014 CURY\r\n               Troque LOGO-CURY.png pela URL da imagem no site.\r\n               =============================================== -->\r\n          <article class=\"mosal-parceiro\">\r\n            <img decoding=\"async\" class=\"mosal-parceiro__logo\" src=\"LOGO-CURY.png\" alt=\"Cury\">\r\n            <span class=\"mosal-parceiro__nome\">CURY<\/span>\r\n          <\/article>\r\n          <!-- FIM DO PARCEIRO 04 -->\r\n\r\n          <!-- ===============================================\r\n               PARCEIRO 05 \u2014 EVEN\r\n               Troque LOGO-EVEN.png pela URL da imagem no site.\r\n               =============================================== -->\r\n          <article class=\"mosal-parceiro\">\r\n            <img decoding=\"async\" class=\"mosal-parceiro__logo\" src=\"LOGO-EVEN.png\" alt=\"Even\">\r\n            <span class=\"mosal-parceiro__nome\">even<\/span>\r\n          <\/article>\r\n          <!-- FIM DO PARCEIRO 05 -->\r\n\r\n          <!-- Para adicionar outro parceiro, copie um bloco\r\n               <article class=\"mosal-parceiro\"> inteiro. -->\r\n\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- BOT\u00d5ES DE NAVEGA\u00c7\u00c3O -->\r\n      <div class=\"mosal-carrossel__controles\">\r\n        <button class=\"mosal-carrossel__botao mosal-carrossel__anterior\" type=\"button\" aria-label=\"Mostrar parceiros anteriores\">\u2190<\/button>\r\n        <button class=\"mosal-carrossel__botao mosal-carrossel__proximo\" type=\"button\" aria-label=\"Mostrar pr\u00f3ximos parceiros\">\u2192<\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n  \/* =========================================================\r\n     8. FUNCIONAMENTO DO CARROSSEL\r\n     - Avan\u00e7a automaticamente a cada 3,5 segundos.\r\n     - Pausa quando o mouse est\u00e1 sobre o carrossel.\r\n     - Os bot\u00f5es permitem avan\u00e7ar e voltar manualmente.\r\n     - N\u00e3o \u00e9 necess\u00e1rio alterar este bloco.\r\n     ========================================================= *\/\r\n  document.querySelectorAll('[data-mosal-carrossel]').forEach(function (carrossel) {\r\n    const trilho = carrossel.querySelector('.mosal-carrossel__trilho');\r\n    const itens = Array.from(carrossel.querySelectorAll('.mosal-parceiro'));\r\n    const anterior = carrossel.querySelector('.mosal-carrossel__anterior');\r\n    const proximo = carrossel.querySelector('.mosal-carrossel__proximo');\r\n    let indice = 0;\r\n    let temporizador;\r\n\r\n    \/* Exibe o nome provis\u00f3rio caso a imagem ainda n\u00e3o exista. *\/\r\n    itens.forEach(function (item) {\r\n      const imagem = item.querySelector('.mosal-parceiro__logo');\r\n\r\n      function usarNomeProvisorio() {\r\n        item.classList.add('sem-imagem');\r\n      }\r\n\r\n      imagem.addEventListener('error', usarNomeProvisorio);\r\n      if (imagem.complete && imagem.naturalWidth === 0) usarNomeProvisorio();\r\n    });\r\n\r\n    function quantidadeVisivel() {\r\n      if (window.innerWidth <= 600) return 1;\r\n      if (window.innerWidth <= 980) return 2;\r\n      return 3;\r\n    }\r\n\r\n    function atualizar() {\r\n      const visiveis = quantidadeVisivel();\r\n      const limite = Math.max(0, itens.length - visiveis);\r\n      indice = Math.min(Math.max(indice, 0), limite);\r\n\r\n      const primeiroItem = itens[0];\r\n      const largura = primeiroItem.getBoundingClientRect().width;\r\n      const gap = parseFloat(getComputedStyle(trilho).gap) || 0;\r\n      trilho.style.transform = 'translateX(-' + (indice * (largura + gap)) + 'px)';\r\n    }\r\n\r\n    function avancar() {\r\n      const limite = Math.max(0, itens.length - quantidadeVisivel());\r\n      indice = indice >= limite ? 0 : indice + 1;\r\n      atualizar();\r\n    }\r\n\r\n    function voltar() {\r\n      const limite = Math.max(0, itens.length - quantidadeVisivel());\r\n      indice = indice <= 0 ? limite : indice - 1;\r\n      atualizar();\r\n    }\r\n\r\n    function iniciarAutomatico() {\r\n      clearInterval(temporizador);\r\n      temporizador = setInterval(avancar, 3500);\r\n    }\r\n\r\n    anterior.addEventListener('click', function () {\r\n      voltar();\r\n      iniciarAutomatico();\r\n    });\r\n\r\n    proximo.addEventListener('click', function () {\r\n      avancar();\r\n      iniciarAutomatico();\r\n    });\r\n\r\n    carrossel.addEventListener('mouseenter', function () {\r\n      clearInterval(temporizador);\r\n    });\r\n\r\n    carrossel.addEventListener('mouseleave', iniciarAutomatico);\r\n\r\n    window.addEventListener('resize', atualizar);\r\n    atualizar();\r\n\r\n    if (!window.matchMedia('(prefers-reduced-motion: reduce)').matches) {\r\n      iniciarAutomatico();\r\n    }\r\n  });\r\n<\/script>\r\n<!-- FIM DA SE\u00c7\u00c3O MOSAL \u2014 GRANDES PARCEIROS -->\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-40d68155 e-con-full e-flex e-con e-parent\" data-id=\"40d68155\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6f91d746 elementor-widget elementor-widget-html\" data-id=\"6f91d746\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\n     SE\u00c7\u00c3O MOSAL \u2014 CTA FINAL\n     Cole o c\u00f3digo inteiro em um widget HTML do Elementor.\n     ========================================================= -->\n\n<style>\n  \/* =========================================================\n     1. CORES E CONFIGURA\u00c7\u00d5ES GERAIS\n     Altere as cores somente neste bloco.\n     ========================================================= *\/\n  .mosal-cta-final,\n  .mosal-cta-final * {\n    box-sizing: border-box;\n  }\n\n  .mosal-cta-final {\n    --mosal-azul: #0878f9;\n    --mosal-azul-escuro: #0069e0;\n    --mosal-azul-profundo: #0054bd;\n    --mosal-marinho: #03294c;\n    --mosal-branco: #ffffff;\n    --mosal-texto: #dcecff;\n    position: relative;\n    isolation: isolate;\n    overflow: hidden;\n    width: 100%;\n    min-height: 390px;\n    padding: clamp(80px, 8vw, 132px) clamp(24px, 6vw, 96px);\n    display: flex;\n    align-items: center;\n    background:\n      radial-gradient(circle at 72% 48%, rgba(45, 156, 255, .72), transparent 35%),\n      linear-gradient(105deg, var(--mosal-azul-escuro) 0%, var(--mosal-azul) 48%, #006bdc 100%);\n    color: var(--mosal-branco);\n    font-family: Arial, Helvetica, sans-serif;\n  }\n\n  \/* Grade decorativa do fundo *\/\n  .mosal-cta-final::before {\n    content: \"\";\n    position: absolute;\n    z-index: -3;\n    inset: 0;\n    pointer-events: none;\n    opacity: .30;\n    background-image:\n      linear-gradient(rgba(255, 255, 255, .15) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(255, 255, 255, .13) 1px, transparent 1px);\n    background-size: 72px 72px;\n    mask-image: linear-gradient(90deg, transparent 5%, #000 60%);\n  }\n\n  \/* Letra M decorativa do fundo *\/\n  .mosal-cta-final__marca {\n    position: absolute;\n    z-index: -2;\n    right: clamp(20px, 7vw, 120px);\n    top: 50%;\n    width: clamp(360px, 40vw, 720px);\n    transform: translateY(-50%);\n    opacity: .14;\n    pointer-events: none;\n    user-select: none;\n  }\n\n  .mosal-cta-final__marca svg {\n    display: block;\n    width: 100%;\n    height: auto;\n  }\n\n  \/* =========================================================\n     2. ESTRUTURA DA SE\u00c7\u00c3O\n     Texto \u00e0 esquerda e bot\u00e3o \u00e0 direita.\n     ========================================================= *\/\n  .mosal-cta-final__conteudo {\n    position: relative;\n    z-index: 1;\n    width: min(1440px, 100%);\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: minmax(0, 1.25fr) auto;\n    gap: clamp(45px, 9vw, 160px);\n    align-items: center;\n  }\n\n  \/* =========================================================\n     3. TEXTOS DA CTA\n     ========================================================= *\/\n  .mosal-cta-final__etiqueta {\n    margin: 0 0 22px;\n    color: #d6eaff;\n    font-size: .72rem;\n    font-weight: 800;\n    line-height: 1.4;\n    letter-spacing: .30em;\n    text-transform: uppercase;\n  }\n\n  .mosal-cta-final__titulo {\n    margin: 0;\n    font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    overflow-wrap: break-word;\n    font-weight: 850;\n    line-height: .88;\n    letter-spacing: -.065em;\n    text-wrap: balance;\n  }\n\n  .mosal-cta-final__texto {\n    max-width: 620px;\n    margin: 28px 0 0;\n    color: var(--mosal-texto);\n    font-size: 1rem;\n    line-height: 1.65;\n  }\n\n  \/* =========================================================\n     4. BOT\u00c3O PRINCIPAL\n     ========================================================= *\/\n  .mosal-cta-final__botao {\n    min-width: 220px;\n    min-height: 54px;\n    padding: 17px 25px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 15px;\n    border: 1px solid rgba(255, 255, 255, .78);\n    border-radius: 999px;\n    background: var(--mosal-branco);\n    box-shadow: 0 16px 36px rgba(0, 41, 99, .28);\n    color: var(--mosal-marinho);\n    font-size: .78rem;\n    font-weight: 800;\n    text-decoration: none;\n    white-space: nowrap;\n    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;\n  }\n\n  .mosal-cta-final__botao:hover {\n    transform: translateY(-3px);\n    background: #eef7ff;\n    box-shadow: 0 22px 44px rgba(0, 41, 99, .36);\n  }\n\n  .mosal-cta-final__botao:focus-visible {\n    outline: 3px solid rgba(255, 255, 255, .58);\n    outline-offset: 4px;\n  }\n\n  .mosal-cta-final__seta {\n    font-size: 1.12rem;\n  }\n\n  \/* =========================================================\n     5. TEXTO DECORATIVO DO CANTO DIREITO\n     Pode ser removido sem prejudicar o restante da se\u00e7\u00e3o.\n     ========================================================= *\/\n  .mosal-cta-final__apoio {\n    position: absolute;\n    right: clamp(24px, 6vw, 96px);\n    bottom: 34px;\n    max-width: 150px;\n    margin: 0;\n    color: rgba(255, 255, 255, .72);\n    font-size: .58rem;\n    font-weight: 800;\n    line-height: 1.55;\n    letter-spacing: .24em;\n    text-align: right;\n    text-transform: uppercase;\n  }\n\n  \/* =========================================================\n     6. TABLET E CELULAR\n     ========================================================= *\/\n  @media (max-width: 900px) {\n    .mosal-cta-final__conteudo {\n      grid-template-columns: 1fr;\n      gap: 42px;\n    }\n\n    .mosal-cta-final__botao {\n      justify-self: start;\n    }\n\n    .mosal-cta-final__apoio {\n      display: none;\n    }\n  }\n\n  @media (max-width: 600px) {\n    .mosal-cta-final {\n      min-height: 0;\n      padding: 78px 22px;\n    }\n\n    .mosal-cta-final__titulo {\n      font-size: clamp(2.3rem, 3.5vw, 4.3rem);\n    }\n\n    .mosal-cta-final__texto {\n      font-size: .95rem;\n    }\n\n    .mosal-cta-final__botao {\n      width: 100%;\n    }\n\n    .mosal-cta-final__marca {\n      right: -60px;\n      width: 360px;\n      opacity: .1;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .mosal-cta-final__botao {\n      transition: none;\n    }\n  }\n<\/style>\n\n<!-- =========================================================\n     7. CONTE\u00daDO DA CTA\n     EDITE OS TEXTOS E O LINK SOMENTE DESTA PARTE PARA BAIXO.\n     ========================================================= -->\n<section class=\"mosal-cta-final\" aria-labelledby=\"mosal-cta-final-titulo\">\n\n  <!-- LETRA DECORATIVA DO FUNDO: pode trocar ou apagar -->\n  <div class=\"mosal-cta-final__marca\" aria-hidden=\"true\">\n    <svg viewBox=\"140 42 913 526\" preserveAspectRatio=\"xMidYMid meet\" focusable=\"false\">\n          <defs>\n            <linearGradient id=\"mosal-marca-grad-cta\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n              <stop offset=\"0\" stop-color=\"#3a8bff\"\/>\n              <stop offset=\"1\" stop-color=\"#1c4fb0\"\/>\n            <\/linearGradient>\n          <\/defs>\n          <!-- faixas -->\n          <g fill=\"#aab7c4\">\n            <polygon points=\"255,357 413,357 413,410 225,410\"\/>\n            <polygon points=\"215,437 413,437 413,490 183,490\"\/>\n            <polygon points=\"175,516 413,516 413,568 140,568\"\/>\n          <\/g>\n          <!-- M azul -->\n          <polygon fill=\"url(#mosal-marca-grad-cta)\" points=\"437,42 750,268 1053,42 1053,130 740,415 560,270 560,568 437,568\"\/>\n          <!-- V e perna direita em cinza -->\n          <polygon fill=\"#aab7c4\" points=\"580,315 745,440 1053,162 1053,568 928,568 928,362 745,550 580,385\"\/>\n        <\/svg>\n  <\/div>\n\n  <div class=\"mosal-cta-final__conteudo\">\n\n    <!-- ===============================================\n         BLOCO DE TEXTO \u00c0 ESQUERDA\n         =============================================== -->\n    <div class=\"mosal-cta-final__chamada\">\n\n      <!-- ETIQUETA PEQUENA -->\n      <p class=\"mosal-cta-final__etiqueta\">Vamos conversar?<\/p>\n\n      <!-- T\u00cdTULO PRINCIPAL -->\n      <h2 class=\"mosal-cta-final__titulo\" id=\"mosal-cta-final-titulo\">\n        Fale com a Mosal.\n      <\/h2>\n\n      <!-- TEXTO DE APOIO -->\n      <p class=\"mosal-cta-final__texto\">\n        Nossa equipe est\u00e1 pronta para entender seu projeto e oferecer a melhor solu\u00e7\u00e3o em alum\u00ednio.\n      <\/p>\n    <\/div>\n    <!-- FIM DO BLOCO DE TEXTO -->\n\n    <!-- ===============================================\n         BOT\u00c3O \u00c0 DIREITA\n         Troque o # pela URL da p\u00e1gina ou formul\u00e1rio.\n         =============================================== -->\n    <a class=\"mosal-cta-final__botao\" href=\"#\">\n      <!-- TEXTO DO BOT\u00c3O -->\n      <span>Entrar em contato<\/span>\n\n      <!-- SETA DO BOT\u00c3O: n\u00e3o precisa alterar -->\n      <span class=\"mosal-cta-final__seta\" aria-hidden=\"true\">\u2192<\/span>\n    <\/a>\n    <!-- FIM DO BOT\u00c3O -->\n\n  <\/div>\n\n  <!-- TEXTO DECORATIVO DO CANTO DIREITO -->\n  <p class=\"mosal-cta-final__apoio\">\n    Solu\u00e7\u00f5es que marcam o Brasil em movimento\n  <\/p>\n<\/section>\n<!-- FIM DA SE\u00c7\u00c3O MOSAL \u2014 CTA FINAL -->\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Alum\u00ednio em movimento Pe\u00e7as que fazem opera\u00e7\u00f5es avan\u00e7arem. Solu\u00e7\u00f5es em alum\u00ednio para ventila\u00e7\u00e3o, exaust\u00e3o e instala\u00e7\u00f5es que constroem um Brasil mais eficiente. Conhe\u00e7a nossos produtos \u2192 01 Mais seguran\u00e7a Alum\u00ednio de alta pureza 02 Mais durabilidade Desempenho para instala\u00e7\u00f5es 03 Mais efici\u00eancia Solu\u00e7\u00f5es sob medida Tradi\u00e7\u00e3o que impulsiona o amanh\u00e3. Quem \u00e9 a Mosal Tradi\u00e7\u00e3o [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":50,"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":182,"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/182"}],"wp:attachment":[{"href":"https:\/\/novo.mosal.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}