  :root{
    --bg: #FBFAF8;
    --panel: #FFFFFF;
    --panel-soft: #EDEBE4;
    --border: #E9E7DF;
    --text: #1F1E1D;
    --text-soft: #3D3929;
    --text-muted: #73716A;
    --text-faint: #A8A69E;

    --accent: #2B2A27;
    --accent-hover: #201F1C;
    --accent-wash: rgba(43,42,39,0.08);

    --r-shell: 1.25rem;
    --r-card: 0.875rem;
    --r-control: 0.4375rem;
    --r-pill: 999px;

    --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  }
  *{ margin:0; padding:0; box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    background:var(--bg); color:var(--text);
    font-family:'Inter', sans-serif;
    line-height:1.6; -webkit-font-smoothing:antialiased;
  }
  a{ color:inherit; text-decoration:none; }
  .wrap{ max-width:1160px; margin:0 auto; padding:0 32px; }

  /* ---------- HEADER ---------- */
  header{
    position:sticky; top:0; z-index:50;
  }
  header::before{
    content:""; position:absolute; inset:0;
    background:rgba(251,250,248,0.86);
    backdrop-filter:blur(10px);
    -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - 26px), transparent 100%);
    mask-image:linear-gradient(to bottom, #000 calc(100% - 26px), transparent 100%);
    transition:background .25s ease;
    pointer-events:none;
  }
  nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 0; position:relative;
  }
  .logo{ font-family:'Source Serif 4', serif; font-size:19px; font-weight:400; display:flex; align-items:center; gap:9px; color:var(--text); }
  .logo-mark{ width:22px; height:22px; border-radius:6px; display:inline-block; object-fit:cover; }
  .nav-links{ display:flex; align-items:center; gap:36px; }
  .nav-links a{ font-size:14px; color:var(--text-muted); transition:color .15s ease; }
  .nav-links a:hover{ color:var(--text); }
  .nav-actions{ display:flex; align-items:center; gap:10px; }
  .btn-text{ font-size:14px; font-weight:500; color:var(--text-soft); padding:9px 14px; }
  .btn-dark{
    background:var(--text); color:var(--panel); font-size:14px; font-weight:500;
    padding:9px 18px; border-radius:6px; transition:background .15s ease;
  }
  .btn-dark:hover{ background:var(--accent-hover); color:#fff; }

  .hero-sub{
    font-size:19px; color:var(--text-muted); max-width:580px; margin-bottom:36px;
    position:relative;
  }
  .hero-sub b{ color:var(--text-soft); font-weight:600; }
  .hero-actions{ display:flex; align-items:center; gap:14px; margin-bottom:26px; position:relative; flex-wrap:wrap; }
  .btn-primary{
    background:var(--text); color:var(--panel); font-weight:500; font-size:15px;
    padding:14px 26px; border-radius:var(--r-control); transition:background .15s ease;
  }
  .btn-primary:hover{ background:var(--accent-hover); color:#fff; }
  .btn-secondary{
    border:1px solid var(--border); color:var(--text-soft); font-weight:500; font-size:15px;
    padding:14px 26px; border-radius:var(--r-control); transition:border-color .15s ease, background .15s ease;
  }
  .btn-secondary:hover{ border-color:var(--text-muted); background:rgba(26,25,21,.03); }
  .hero-trust{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--text-faint); position:relative; flex-wrap:wrap; }
  /* A bolinha verde saiu: ela é o sinal de status de painel de
     serviço, e a página não tem um status real por trás dela. O texto
     "No ar agora" continua e diz a mesma coisa sem prometer um
     indicador ao vivo que não existe. O gap sai junto — sem o ::before
     não há o que separar. */
  .avail{ display:inline-flex; align-items:center; }
  /* ---------- FOOTER ---------- */
  footer{ padding:72px 0 40px; }
  .footer-top{ display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:40px; padding-bottom:56px; }
  .footer-brand p{ font-size:13.5px; color:var(--text-muted); margin-top:14px; max-width:230px; }
  .footer-col h5{ font-size:13px; font-weight:600; color:var(--text); margin-bottom:16px; }
  .footer-col a{ display:block; font-size:13.5px; color:var(--text-muted); margin-bottom:11px; transition:color .15s ease; }
  .footer-col a:hover{ color:var(--text); }
  .footer-bottom{
    display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
    padding-top:28px; border-top:1px solid var(--border);
    font-size:12.5px; color:var(--text-faint);
  }


  .hero-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; align-items:center; position:relative; }
  .hero-grid h1{ font-size:clamp(2.4rem,4.6vw,4rem); }
  .hero-grid .hero-sub{ max-width:30em; }
  @media (max-width:960px){ .hero-grid{ grid-template-columns:1fr; gap:40px; } .draw-col{ margin:0 auto; max-width:440px; } }
  .draw-col{ width:100%; max-width:500px; margin-left:auto; animation:h3-in .8s cubic-bezier(.22,.68,.36,1) .2s both; }
  .hx3{ display:block; width:100%; height:auto; overflow:visible; }
  .hx3 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
  .hx3 .d{ stroke-dasharray:1; stroke-dashoffset:0; }
  .hx3 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }
  .hx3 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }
  .hx3 .flag{ transform-box:fill-box; transform-origin:0 50%; animation:h3-wave 2.8s ease-in-out infinite; }
  .hx3.go .d{ animation:h3-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }
  .hx3.go .f, .hx3.go .tx{ animation:h3-fi .5s ease both; animation-delay:var(--t,0s); }
  .hx3.go .fl{ animation:h3-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }
  @keyframes h3-dr{ 0%{ stroke-dashoffset:1; opacity:0; } 1%{ stroke-dashoffset:1; opacity:1; } 100%{ stroke-dashoffset:0; opacity:1; } }
  @keyframes h3-fi{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
  @keyframes h3-drop{ 0%{ opacity:0; transform:translateY(-46px); } 30%{ opacity:1; } 100%{ opacity:1; transform:none; } }
  @keyframes h3-wave{ 0%,100%{ transform:scaleX(1) skewY(0); } 50%{ transform:scaleX(.88) skewY(5deg); } }
  @keyframes h3-in{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
  @media (prefers-reduced-motion: reduce){ .draw-col{ animation:none; } .hx3 *{ animation:none !important; } }
  
.hx4{ display:block; width:100%; height:auto; overflow:visible; }.hx4 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }.hx4 .m{ stroke:var(--text-faint); stroke-width:2; }.hx4 .d{ stroke-dasharray:1; stroke-dashoffset:0; }.hx4 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }.hx4 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }.hx4 .flag{ transform-box:fill-box; transform-origin:0 50%; animation:h4-wave 2.8s ease-in-out infinite; }.hx4.go .d{ animation:h4-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }.hx4.go .f, .hx4.go .tx{ animation:h4-fi .5s ease both; animation-delay:var(--t,0s); }.hx4.go .fl{ animation:h4-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }@keyframes h4-dr{ 0%{ stroke-dashoffset:1; opacity:0; } 1%{ stroke-dashoffset:1; opacity:1; } 100%{ stroke-dashoffset:0; opacity:1; } }@keyframes h4-fi{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }@keyframes h4-drop{ 0%{ opacity:0; transform:translateY(-46px); } 30%{ opacity:1; } 100%{ opacity:1; transform:none; } }@keyframes h4-wave{ 0%,100%{ transform:scaleX(1) skewY(0); } 50%{ transform:scaleX(.88) skewY(5deg); } }@keyframes h4-in{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }@media (prefers-reduced-motion: reduce){ .draw-col{ animation:none; } .hx4 *{ animation:none !important; } }.hx5{ display:block; width:100%; height:auto; overflow:visible; }.hx5 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }.hx5 .m{ stroke:var(--text-faint); stroke-width:2; }.hx5 .d{ stroke-dasharray:1; stroke-dashoffset:0; }.hx5 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }.hx5 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }.hx5 .flag{ transform-box:fill-box; transform-origin:0 50%; animation:h5-wave 2.8s ease-in-out infinite; }.hx5.go .d{ animation:h5-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }.hx5.go .f, .hx5.go .tx{ animation:h5-fi .5s ease both; animation-delay:var(--t,0s); }.hx5.go .fl{ animation:h5-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }@keyframes h5-dr{ 0%{ stroke-dashoffset:1; opacity:0; } 1%{ stroke-dashoffset:1; opacity:1; } 100%{ stroke-dashoffset:0; opacity:1; } }@keyframes h5-fi{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }@keyframes h5-drop{ 0%{ opacity:0; transform:translateY(-46px); } 30%{ opacity:1; } 100%{ opacity:1; transform:none; } }@keyframes h5-wave{ 0%,100%{ transform:scaleX(1) skewY(0); } 50%{ transform:scaleX(.88) skewY(5deg); } }@keyframes h5-in{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }@media (prefers-reduced-motion: reduce){ .draw-col{ animation:none; } .hx5 *{ animation:none !important; } }.hx6{ display:block; width:100%; height:auto; overflow:visible; }.hx6 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }.hx6 .m{ stroke:var(--text-faint); stroke-width:2; }.hx6 .d{ stroke-dasharray:1; stroke-dashoffset:0; }.hx6 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }.hx6 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }.hx6 .flag{ transform-box:fill-box; transform-origin:0 50%; animation:h6-wave 2.8s ease-in-out infinite; }.hx6.go .d{ animation:h6-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }.hx6.go .f, .hx6.go .tx{ animation:h6-fi .5s ease both; animation-delay:var(--t,0s); }.hx6.go .fl{ animation:h6-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }@keyframes h6-dr{ 0%{ stroke-dashoffset:1; opacity:0; } 1%{ stroke-dashoffset:1; opacity:1; } 100%{ stroke-dashoffset:0; opacity:1; } }@keyframes h6-fi{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }@keyframes h6-drop{ 0%{ opacity:0; transform:translateY(-46px); } 30%{ opacity:1; } 100%{ opacity:1; transform:none; } }@keyframes h6-wave{ 0%,100%{ transform:scaleX(1) skewY(0); } 50%{ transform:scaleX(.88) skewY(5deg); } }@keyframes h6-in{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }@media (prefers-reduced-motion: reduce){ .draw-col{ animation:none; } .hx6 *{ animation:none !important; } }svg.crane{display:block;width:100%;height:auto;overflow:hidden}.hx-stack{display:grid}.hx-stack>svg{grid-area:1/1;align-self:center;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility 0s .7s}.hx-stack>svg.act{opacity:1;visibility:visible;transition:opacity .7s ease}
.hx10 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.hx10 .d{ stroke-dasharray:1; stroke-dashoffset:0; }
.hx10 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }
.hx10 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }
.hx10 .flag{ transform-box:fill-box; transform-origin:0 50%; animation:h3-wave 2.8s ease-in-out infinite; }
.hx10.go .d{ animation:h3-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }
.hx10.go .f, .hx10.go .tx{ animation:h3-fi .5s ease both; animation-delay:var(--t,0s); }
.hx10.go .fl{ animation:h3-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }
.hx10 .m{ stroke:var(--text-faint); stroke-width:2; }
@media (prefers-reduced-motion: reduce){ .hx10 *{ animation:none !important; } }
.hx8 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.hx8 .d{ stroke-dasharray:1; stroke-dashoffset:0; }
.hx8 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }
.hx8 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }
.hx8 .flag{ transform-box:fill-box; transform-origin:0 50%; animation:h3-wave 2.8s ease-in-out infinite; }
.hx8.go .d{ animation:h3-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }
.hx8.go .f, .hx8.go .tx{ animation:h3-fi .5s ease both; animation-delay:var(--t,0s); }
.hx8.go .fl{ animation:h3-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }
.hx8 .m{ stroke:var(--text-faint); stroke-width:2; }
@media (prefers-reduced-motion: reduce){ .hx8 *{ animation:none !important; } }
.hx9 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.hx9 .d{ stroke-dasharray:1; stroke-dashoffset:0; }
.hx9 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }
.hx9 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }
.hx9 .flag{ transform-box:fill-box; transform-origin:0 50%; animation:h3-wave 2.8s ease-in-out infinite; }
.hx9.go .d{ animation:h3-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }
.hx9.go .f, .hx9.go .tx{ animation:h3-fi .5s ease both; animation-delay:var(--t,0s); }
.hx9.go .fl{ animation:h3-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }
.hx9 .m{ stroke:var(--text-faint); stroke-width:2; }
@media (prefers-reduced-motion: reduce){ .hx9 *{ animation:none !important; } }
.hx11{ display:block; width:100%; height:auto; overflow:visible; }
.hx11 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.hx11 .d{ stroke-dasharray:1; stroke-dashoffset:0; }
.hx11 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }
.hx11 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }
.hx11 .m{ stroke:var(--text-faint); stroke-width:2; }
.hx11.go .d{ animation:h3-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }
.hx11.go .f, .hx11.go .tx{ animation:h3-fi .5s ease both; animation-delay:var(--t,0s); }
.hx11.go .fl{ animation:h3-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }
@media (prefers-reduced-motion: reduce){ .hx11 *{ animation:none !important; } }
.hx12{ display:block; width:100%; height:auto; overflow:visible; }
.hx12 .s{ fill:none; stroke:var(--text); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.hx12 .d{ stroke-dasharray:1; stroke-dashoffset:0; }
.hx12 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }
.hx12 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }
.hx12 .m{ stroke:var(--text-faint); stroke-width:2; }
.hx12.go .d{ animation:h3-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }
.hx12.go .f, .hx12.go .tx{ animation:h3-fi .5s ease both; animation-delay:var(--t,0s); }
.hx12.go .fl{ animation:h3-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }
@media (prefers-reduced-motion: reduce){ .hx12 *{ animation:none !important; } }
/* ---------- hx13 · fluxo de nós (linguagem visual de orquestrador) ---------- */
.hx13{ display:block; width:100%; height:auto; overflow:visible; }
.hx13 .s{ fill:none; stroke:var(--text); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.hx13 .d{ stroke-dasharray:1; stroke-dashoffset:0; }
.hx13 .tx{ font:500 11.5px 'Inter',system-ui,sans-serif; fill:var(--text-muted); }
.hx13 .pill{ font:600 12.5px 'Inter',system-ui,sans-serif; fill:var(--bg); }
.hx13.go .d{ animation:h3-dr var(--u,.8s) ease-in-out both; animation-delay:var(--t,0s); }
.hx13.go .f, .hx13.go .tx{ animation:h3-fi .5s ease both; animation-delay:var(--t,0s); }
.hx13.go .fl{ animation:h3-drop .7s cubic-bezier(.3,1.35,.5,1) both; animation-delay:var(--t,0s); }
.hx13 .pulse{ opacity:0; transform-box:view-box; }
.hx13.go .pulse{ animation:n8-pulse 3.4s ease-in-out infinite; animation-delay:2.5s; }
@keyframes n8-pulse{
  0%{ transform:translate(0,0); opacity:0; }
  6%{ opacity:1; }
  34%{ transform:translate(186px,0); opacity:1; }
  48%{ transform:translate(186px,-104px); opacity:1; }
  62%{ transform:translate(216px,-104px); opacity:1; }
  76%{ transform:translate(216px,-104px); opacity:0; }
  100%{ transform:translate(216px,-104px); opacity:0; }
}
@media (prefers-reduced-motion: reduce){ .hx13 *{ animation:none !important; } .hx13 .pulse{ opacity:0; } }
/* ---------- páginas de produto ---------- */
.pp-hero h1{ font-family:'Source Serif 4',serif; font-weight:400; line-height:1.08; letter-spacing:-.01em; margin-bottom:22px; }
.pp-hero{ padding:96px 0 84px; position:relative; overflow:hidden; }
.pp-eyebrow{ font-size:12.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); margin-bottom:18px; }
.pp-sec{ padding:72px 0; border-top:1px solid var(--border); }
.pp-sec h2{ font-family:'Source Serif 4',serif; font-weight:400; font-size:2.1rem; line-height:1.15; margin-bottom:10px; }
.pp-sec .lead{ color:var(--text-muted); max-width:620px; margin-bottom:36px; font-size:17px; }
.pp-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r-card); overflow:hidden; }
.pp-card{ background:var(--panel); padding:28px 28px 30px; }
.pp-card h3{ font-size:16px; font-weight:600; margin-bottom:8px; }
.pp-card p{ font-size:14.5px; color:var(--text-muted); }
.pp-cta{ background:var(--panel); border:1px solid var(--border); border-radius:var(--r-shell); padding:56px 40px; text-align:center; }
.pp-cta h2{ margin-bottom:12px; } .pp-cta p{ color:var(--text-muted); margin:0 auto 26px; max-width:520px; }
.pp-cta .hero-actions{ justify-content:center; margin-bottom:0; }
/* .pp-rel (fileira de "Outras soluções") saiu junto com o bloco na marcação:
   os links das sete soluções já vivem no rodapé, que é gerado do mesmo array $SOL. */
@media (max-width:960px){
  .wrap{ padding:0 24px; } .nav-links{ display:none; }
  .pp-hero{ padding:56px 0 48px; } .pp-grid{ grid-template-columns:1fr; }
  .pp-sec h2{ font-size:1.7rem; } .pp-cta{ padding:40px 22px; }
  .footer-top{ grid-template-columns:1fr 1fr; gap:32px; }
}
