/* ============================================================
   LIXUM.LABS — DESIGN SYSTEM GLOBAL  v1.0
   Carrega 1x no site inteiro:
   Elementor > Site Settings > Custom Code > Apply on "Entire Site" > <head>.
   NAO duplicar nenhuma destas regras dentro de um widget HTML.

   Convertido de src/index.css (React/Vite). Tres mudancas obrigatorias
   em relacao ao original, cada uma com motivo:
   1. Todo token e classe ganhou prefixo lx- : o tema hello-elementor e o
      proprio Elementor usam nomes genericos; sem prefixo ha colisao.
   2. O reset deixou de ser global (*) e passou a ser escopado em .lx-scope:
      um reset global apagaria margens do admin bar, do menu e dos widgets
      nativos do Elementor.
   3. Ganhou .lx-bleed : no React o layout era livre; dentro de um Container
      do Elementor a secao precisa sangrar para ocupar a tela toda.

   FONTES: nao carregar aqui via @import — bloqueia a renderizacao e o
   PageSpeed acusa. Vao num Custom Code separado, com <link rel="preconnect">.
   ============================================================ */

/* ── TOKENS ────────────────────────────────────────────────── */
:root{
  /* Navy */
  --lx-navy-100:#A8B4BE; --lx-navy-200:#6B7C8B; --lx-navy-300:#495A6A;
  --lx-navy-400:#344452; --lx-navy-500:#24323E; --lx-navy-600:#1A2833;
  --lx-navy-700:#141F28; --lx-navy-800:#0D1820; --lx-navy-900:#091119;

  /* Lime — signal */
  --lx-lime-100:#FBFED9; --lx-lime-200:#F7FEAE; --lx-lime-300:#F3FD7F;
  --lx-lime-400:#EEFC4D; --lx-lime-500:#E4FB0C;

  /* Status */
  --lx-positive:#6EE7B7; --lx-warning:#F5A524;
  --lx-danger:#F87171;   --lx-info:#7EC8E3;

  /* Ink */
  --lx-ink:#F5F7FA; --lx-ink-quiet:#A8B4BE;
  --lx-ink-dim:#6B7C8B; --lx-ink-faint:#495A6A;

  /* Semanticos */
  --lx-bg:var(--lx-navy-900);
  --lx-bg-raised:var(--lx-navy-800);
  --lx-bg-sunken:#05090D;
  --lx-surface:var(--lx-navy-800);
  --lx-surface-2:var(--lx-navy-700);
  --lx-surface-3:var(--lx-navy-600);
  --lx-text:var(--lx-ink);
  --lx-text-quiet:var(--lx-ink-quiet);
  --lx-text-dim:var(--lx-ink-dim);
  --lx-accent:var(--lx-lime-500);
  --lx-accent-soft:rgba(228,251,12,.08);
  --lx-accent-edge:rgba(228,251,12,.24);
  --lx-border:rgba(168,180,190,.08);
  --lx-border-strong:rgba(168,180,190,.16);
  --lx-border-lime:rgba(228,251,12,.2);

  /* Gradientes */
  --lx-grad-soft:radial-gradient(ellipse 80% 60% at 30% 20%,rgba(228,251,12,.12) 0%,transparent 60%),linear-gradient(180deg,var(--lx-navy-800) 0%,var(--lx-navy-900) 100%);
  --lx-grad-card:linear-gradient(145deg,rgba(26,40,51,.6) 0%,rgba(9,17,25,.9) 100%);
  --lx-grad-lime-edge:linear-gradient(90deg,transparent,rgba(228,251,12,.3),transparent);
  --lx-grad-hairline:linear-gradient(90deg,transparent,rgba(168,180,190,.2),transparent);

  /* Tipografia */
  --lx-font-display:"Space Grotesk",system-ui,sans-serif;
  --lx-font-body:"Inter",system-ui,sans-serif;
  --lx-font-mono:"JetBrains Mono",ui-monospace,monospace;

  --lx-fs-display-xxl:clamp(3.5rem,8vw,6rem);
  --lx-fs-display-xl:clamp(3rem,6.5vw,4.5rem);
  --lx-fs-display-l:clamp(2.5rem,5vw,3.5rem);
  --lx-fs-headline:clamp(1.75rem,3vw,2.5rem);
  --lx-fs-title:1.75rem;
  --lx-fs-subtitle:1.25rem;
  --lx-fs-body-l:1.125rem;
  --lx-fs-body:1rem;
  --lx-fs-caption:.8125rem;
  --lx-fs-micro:.6875rem;

  --lx-lh-tight:.95; --lx-lh-snug:1.15; --lx-lh-normal:1.5; --lx-lh-loose:1.7;
  --lx-tk-display:-.04em; --lx-tk-heading:-.02em;
  --lx-tk-label:.18em;    --lx-tk-micro:.24em;

  /* Espacamento (base 4pt) */
  --lx-sp-1:4px;  --lx-sp-2:8px;  --lx-sp-3:12px; --lx-sp-4:16px; --lx-sp-5:24px;
  --lx-sp-6:32px; --lx-sp-7:48px; --lx-sp-8:64px; --lx-sp-9:96px; --lx-sp-10:128px;

  /* Raios */
  --lx-r-xs:4px; --lx-r-sm:8px; --lx-r-md:12px; --lx-r-lg:16px; --lx-r-xl:24px;

  /* Elevacao */
  --lx-shadow-1:0 1px 0 rgba(255,255,255,.04) inset,0 1px 2px rgba(0,0,0,.4);
  --lx-shadow-2:0 1px 0 rgba(255,255,255,.04) inset,0 8px 24px rgba(0,0,0,.4);
  --lx-shadow-3:0 1px 0 rgba(255,255,255,.05) inset,0 24px 48px rgba(0,0,0,.55);
  --lx-glow-lime:0 0 48px rgba(228,251,12,.18);
  --lx-glow-lime-strong:0 0 64px rgba(228,251,12,.35);

  /* Motion — Brand & UI v1.0 */
  --lx-t-micro:120ms; --lx-t-default:200ms;
  --lx-t-surface:320ms; --lx-t-overlay:600ms;
  --lx-ease:cubic-bezier(.2,.8,.2,1);
  --lx-ease-out:cubic-bezier(.16,1,.3,1);

  /* Container */
  --lx-container:1400px; --lx-gutter-sm:28px; --lx-gutter-lg:60px;
}

/* ── RESET ESCOPADO ────────────────────────────────────────────
   Escopado de proposito. No React o reset era global (*), aqui isso
   quebraria o tema. Toda secao carrega .lx-scope no elemento raiz. */
.lx-scope,.lx-scope *,.lx-scope *::before,.lx-scope *::after{box-sizing:border-box;margin:0;padding:0}
.lx-scope{
  font-family:var(--lx-font-body);
  font-size:var(--lx-fs-body);
  line-height:var(--lx-lh-normal);
  color:var(--lx-text);
  background:var(--lx-bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-feature-settings:"cv11","ss01","ss03";
}
.lx-scope img,.lx-scope svg{max-width:100%;display:block}
.lx-scope a{text-decoration:none;color:inherit;transition:color var(--lx-t-default) var(--lx-ease)}
.lx-scope button{cursor:pointer;border:none;background:none;font-family:inherit;color:inherit}
.lx-scope :where(a,button):focus-visible{outline:2px solid var(--lx-lime-500);outline-offset:2px;border-radius:var(--lx-r-xs)}
.lx-scope ul,.lx-scope ol{list-style:none}

::selection{background:var(--lx-lime-500);color:var(--lx-navy-900)}

/* Scrollbar — signal only */
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:var(--lx-navy-900)}
::-webkit-scrollbar-thumb{background:var(--lx-navy-500);border-radius:2px}
::-webkit-scrollbar-thumb:hover{background:var(--lx-lime-500)}

/* ── FULL-BLEED ────────────────────────────────────────────────
   Sangra de ponta a ponta mesmo dentro de um Container "Boxed".
   Margem negativa, NAO `left:50% + translateX(-50%)`: translate cria
   containing block novo e quebra position:fixed/sticky nos filhos.
   O corte do scroll horizontal e responsabilidade de html/body (logo
   abaixo), nunca do bloco — overflow
   aqui transformaria a secao em container de rolagem e recortaria
   o menu mobile, que e position:absolute. */
.lx-bleed{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw)}
/* A sobra do 100vw (largura da barra de rolagem, 1-2px no Windows) e
   cortada em html+body com clip, nao hidden: clip nao cria container de
   rolagem, entao position:sticky continua funcionando (card do Metodo). */
html,body{overflow-x:clip}

/* ── WRAPPER DE CONTEUDO ───────────────────────────────────── */
.lx-wrap{width:100%;max-width:var(--lx-container);margin:0 auto;padding-inline:var(--lx-gutter-sm)}
@media(min-width:768px){.lx-wrap{padding-inline:var(--lx-gutter-lg)}}

/* ── SECAO ─────────────────────────────────────────────────── */
.lx-section{position:relative;padding:var(--lx-sp-10) 0}
@media(max-width:767px){.lx-section{padding:var(--lx-sp-9) 0}}
.lx-section-head{display:flex;align-items:center;gap:var(--lx-sp-3);margin-bottom:var(--lx-sp-5)}
.lx-section-num{font-family:var(--lx-font-mono);font-size:var(--lx-fs-micro);letter-spacing:var(--lx-tk-micro);color:var(--lx-text-dim);padding:4px 8px;border:1px solid var(--lx-border);border-radius:var(--lx-r-xs)}

/* Telas < 375px (SE 1a geracao, Galaxy mini): o piso dos clamps de
   display estoura palavras longas ("transparente,", "Construímos"). */
@media(max-width:374px){:root{--lx-fs-display-xxl:2.4rem;--lx-fs-display-xl:2.3rem;--lx-fs-display-l:2.1rem;--lx-fs-headline:1.6rem}}
.lx-scope :where(h1,h2,h3){overflow-wrap:break-word}

/* ── TIPOGRAFIA ────────────────────────────────────────────── */
.lx-display-xxl{font-family:var(--lx-font-display);font-size:var(--lx-fs-display-xxl);line-height:var(--lx-lh-tight);letter-spacing:var(--lx-tk-display);font-weight:700;color:var(--lx-text)}
.lx-display-xl{font-family:var(--lx-font-display);font-size:var(--lx-fs-display-xl);line-height:var(--lx-lh-tight);letter-spacing:var(--lx-tk-display);font-weight:700;color:var(--lx-text)}
.lx-display-l{font-family:var(--lx-font-display);font-size:var(--lx-fs-display-l);line-height:1.05;letter-spacing:var(--lx-tk-heading);font-weight:700;color:var(--lx-text)}
.lx-headline{font-family:var(--lx-font-display);font-size:var(--lx-fs-headline);line-height:1.1;letter-spacing:var(--lx-tk-heading);font-weight:600;color:var(--lx-text)}
.lx-title{font-family:var(--lx-font-display);font-size:var(--lx-fs-title);line-height:1.2;letter-spacing:-.01em;font-weight:600;color:var(--lx-text)}
.lx-subtitle{font-family:var(--lx-font-body);font-size:var(--lx-fs-subtitle);line-height:1.4;font-weight:500;color:var(--lx-text)}
.lx-body-l{font-family:var(--lx-font-body);font-size:var(--lx-fs-body-l);line-height:var(--lx-lh-loose);color:var(--lx-text-quiet)}
.lx-body{font-family:var(--lx-font-body);font-size:var(--lx-fs-body);line-height:var(--lx-lh-loose);color:var(--lx-text-quiet)}
.lx-caption{font-family:var(--lx-font-body);font-size:var(--lx-fs-caption);line-height:1.5;color:var(--lx-text-dim)}
.lx-label{font-family:var(--lx-font-mono);font-size:var(--lx-fs-caption);line-height:1;letter-spacing:var(--lx-tk-label);text-transform:uppercase;color:var(--lx-lime-500);font-weight:500}
.lx-micro{font-family:var(--lx-font-mono);font-size:var(--lx-fs-micro);line-height:1;letter-spacing:var(--lx-tk-micro);text-transform:uppercase;color:var(--lx-text-dim);font-weight:500}
.lx-mono{font-family:var(--lx-font-mono)}
.lx-font-display{font-family:var(--lx-font-display)}
.lx-font-body{font-family:var(--lx-font-body)}

.lx-signal{color:var(--lx-lime-500)}
.lx-quiet{color:var(--lx-text-quiet)}
.lx-dim{color:var(--lx-text-dim)}

/* ── FILETES ───────────────────────────────────────────────── */
.lx-hairline{height:1px;background:var(--lx-grad-hairline);border:0}
.lx-hairline-lime{height:1px;background:var(--lx-grad-lime-edge);border:0}
.lx-border-t{border-top:1px solid var(--lx-border)}
.lx-border-b{border-bottom:1px solid var(--lx-border)}

/* ── BOTOES ────────────────────────────────────────────────── */
.lx-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--lx-sp-2);font-family:var(--lx-font-display);font-weight:500;font-size:.9rem;line-height:1;padding:14px 22px;border-radius:var(--lx-r-sm);letter-spacing:-.01em;transition:all var(--lx-t-default) var(--lx-ease);border:1px solid transparent;cursor:pointer;white-space:nowrap;user-select:none}
.lx-btn svg{width:16px;height:16px;fill:currentColor;flex:none}
.lx-btn-sm{padding:10px 16px;font-size:.82rem}
.lx-btn-lg{padding:18px 28px;font-size:1rem}
/* :link e :visited + !important porque o hello-elementor tem regra
   propria para <a> e vence por especificidade sem isso. */
.lx-btn-primary,.lx-btn-primary:link,.lx-btn-primary:visited{background:var(--lx-lime-500);color:var(--lx-navy-900)!important;font-weight:600}
.lx-btn-primary:hover,.lx-btn-primary:focus{background:var(--lx-lime-400);color:var(--lx-navy-900)!important;transform:translateY(-1px);box-shadow:var(--lx-glow-lime-strong)}
.lx-btn-secondary,.lx-btn-secondary:link,.lx-btn-secondary:visited{background:var(--lx-surface-2);color:var(--lx-text)!important;border-color:var(--lx-border-strong)}
.lx-btn-secondary:hover,.lx-btn-secondary:focus{background:var(--lx-surface-3);border-color:var(--lx-lime-500);color:var(--lx-lime-500)!important}
.lx-btn-ghost,.lx-btn-ghost:link,.lx-btn-ghost:visited{background:transparent;color:var(--lx-text-quiet)!important;border-color:var(--lx-border)}
.lx-btn-ghost:hover,.lx-btn-ghost:focus{color:var(--lx-lime-500)!important;border-color:var(--lx-border-lime);background:var(--lx-accent-soft)}

/* ── TAGS ──────────────────────────────────────────────────── */
.lx-tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--lx-font-mono);font-size:var(--lx-fs-micro);letter-spacing:var(--lx-tk-label);text-transform:uppercase;padding:5px 9px;border-radius:var(--lx-r-xs);border:1px solid var(--lx-border);color:var(--lx-text-dim);background:transparent}
.lx-tag-signal{color:var(--lx-lime-500);border-color:var(--lx-border-lime);background:var(--lx-accent-soft)}
.lx-tag-positive{color:var(--lx-positive);border-color:rgba(110,231,183,.25);background:rgba(110,231,183,.06)}
.lx-tag-warning{color:var(--lx-warning);border-color:rgba(245,165,36,.25);background:rgba(245,165,36,.06)}
.lx-tag-danger{color:var(--lx-danger);border-color:rgba(248,113,113,.25);background:rgba(248,113,113,.06)}

.lx-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.lx-dot-pulse{animation:lxdotpulse 1.6s ease-in-out infinite}
@keyframes lxdotpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.85)}}

/* ── SUPERFICIES ───────────────────────────────────────────── */
.lx-surface{background:var(--lx-surface);border:1px solid var(--lx-border);border-radius:var(--lx-r-md);transition:border-color var(--lx-t-default) var(--lx-ease),background var(--lx-t-default) var(--lx-ease)}
.lx-surface:hover{border-color:var(--lx-border-strong)}
.lx-surface-raised{background:var(--lx-grad-card);border:1px solid var(--lx-border);border-radius:var(--lx-r-md);box-shadow:var(--lx-shadow-2)}

.lx-pcard{position:relative;overflow:hidden;background:var(--lx-surface);border:1px solid var(--lx-border);border-radius:var(--lx-r-md);transition:all var(--lx-t-surface) var(--lx-ease)}
.lx-pcard::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 80% 100% at 100% 0%,rgba(228,251,12,.18) 0%,transparent 55%);opacity:.6;transition:opacity var(--lx-t-surface) var(--lx-ease);pointer-events:none}
.lx-pcard:hover{border-color:var(--lx-border-lime);transform:translateY(-2px)}
.lx-pcard:hover::before{opacity:1}

/* ── FORMULARIO ────────────────────────────────────────────── */
.lx-field-label{display:block;font-family:var(--lx-font-mono);font-size:var(--lx-fs-micro);letter-spacing:var(--lx-tk-label);text-transform:uppercase;color:var(--lx-text-dim);margin-bottom:8px}
.lx-field{width:100%;background:var(--lx-surface-2);border:1px solid var(--lx-border);border-radius:var(--lx-r-sm);padding:14px 16px;font-family:var(--lx-font-body);font-size:var(--lx-fs-body);color:var(--lx-text);transition:all var(--lx-t-default) var(--lx-ease);outline:none}
.lx-field::placeholder{color:var(--lx-text-dim)}
.lx-field:hover{border-color:var(--lx-border-strong)}
.lx-field:focus{border-color:var(--lx-lime-500);box-shadow:0 0 0 3px rgba(228,251,12,.12);background:var(--lx-surface)}
textarea.lx-field{resize:vertical;min-height:120px}

/* ── CODE SURFACE ──────────────────────────────────────────── */
.lx-code{background:var(--lx-bg-sunken);border:1px solid var(--lx-border);border-radius:var(--lx-r-md);padding:var(--lx-sp-5);font-family:var(--lx-font-mono);font-size:var(--lx-fs-caption);color:var(--lx-text-quiet);line-height:1.7;overflow:auto;position:relative}
.lx-code .k{color:var(--lx-lime-500)}
.lx-code .s{color:var(--lx-positive)}
.lx-code .c{color:var(--lx-text-dim);font-style:italic}

/* ── TICKER ────────────────────────────────────────────────── */
.lx-ticker{overflow:hidden;border-top:1px solid var(--lx-border);border-bottom:1px solid var(--lx-border);padding:16px 0;background:var(--lx-navy-800);position:relative}
.lx-ticker-track{display:flex;gap:56px;white-space:nowrap;animation:lxtick 30s linear infinite;width:max-content}
@keyframes lxtick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.lx-ticker-item{font-family:var(--lx-font-mono);font-size:var(--lx-fs-caption);font-weight:500;letter-spacing:var(--lx-tk-label);text-transform:uppercase;color:var(--lx-text-dim);display:inline-flex;align-items:center;gap:12px}
.lx-ticker-item.hi{color:var(--lx-text)}
.lx-ticker-item.ac{color:var(--lx-lime-500)}

/* ── AMBIENCIA ─────────────────────────────────────────────── */
.lx-aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.lx-aurora::before{content:"";position:absolute;inset:-20%;background:radial-gradient(ellipse 50% 40% at 20% 15%,rgba(228,251,12,.12) 0%,transparent 60%),radial-gradient(ellipse 70% 60% at 80% 90%,rgba(73,90,106,.4) 0%,transparent 65%),radial-gradient(ellipse 40% 30% at 60% 35%,rgba(228,251,12,.06) 0%,transparent 70%);filter:blur(40px)}
.lx-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(168,180,190,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(168,180,190,.04) 1px,transparent 1px);background-size:80px 80px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 30%,transparent 80%);pointer-events:none}

/* ── TABELA COMPARATIVA ────────────────────────────────────── */
.lx-ctable{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--lx-border);border-radius:var(--lx-r-md);overflow:hidden;background:var(--lx-surface)}
.lx-ctable thead th{background:var(--lx-surface-2);padding:18px 22px;font-family:var(--lx-font-mono);font-size:var(--lx-fs-caption);font-weight:500;letter-spacing:var(--lx-tk-label);text-transform:uppercase;text-align:left;color:var(--lx-text-dim);border-bottom:1px solid var(--lx-border)}
.lx-ctable thead th.hi{color:var(--lx-lime-500)}
.lx-ctable td{padding:16px 22px;font-size:var(--lx-fs-caption);color:var(--lx-text-quiet);border-bottom:1px solid var(--lx-border)}
.lx-ctable tr:last-child td{border-bottom:0}

/* ── REVEAL ON SCROLL ──────────────────────────────────────────
   Substitui o Framer Motion, que nao sobrevive ao Elementor.
   O estado inicial so e aplicado quando o JS marca .lx-reveal-on no
   elemento raiz da secao — assim, se o script falhar ou o JS estiver
   desligado, o conteudo aparece normalmente em vez de ficar invisivel. */
.lx-reveal-on .lx-reveal{opacity:0;transform:translateY(14px);transition:opacity var(--lx-t-surface) var(--lx-ease-out),transform var(--lx-t-surface) var(--lx-ease-out)}
.lx-reveal-on .lx-reveal.is-in{opacity:1;transform:none}
/* Stagger: style="--lx-d:2" no elemento atrasa 2 x 90ms. */
.lx-reveal-on .lx-reveal{transition-delay:calc(var(--lx-d,0) * 90ms)}

/* ── UTILITARIOS ───────────────────────────────────────────── */
.lx-stack>*+*{margin-top:var(--lx-sp-5)}
.lx-kbd{font-family:var(--lx-font-mono);font-size:.72rem;padding:2px 6px;border-radius:var(--lx-r-xs);border:1px solid var(--lx-border-strong);background:var(--lx-surface-2);color:var(--lx-text-quiet)}
.lx-caret::after{content:"\25AE";display:inline-block;margin-left:4px;color:var(--lx-lime-500);animation:lxblink 1.1s steps(2,start) infinite}
@keyframes lxblink{0%,100%{opacity:1}50%{opacity:0}}

/* ══ PADROES DE SECAO ═════════════════════════════════════════
   Formatos que se repetem nas paginas internas (Solucoes, Branding,
   Dados, Trabalhos). O widget so traz o que for proprio dele. */

/* Fundo e divisoria */
.lx-sec-alt{background:var(--lx-bg-raised)}
.lx-sec-line{border-top:1px solid var(--lx-border)}

/* Abertura: titulo + texto lado a lado, ou titulo sozinho */
.lx-intro{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:end;margin-bottom:var(--lx-sp-8)}
@media(min-width:1024px){.lx-intro{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
.lx-intro-stack{margin-bottom:var(--lx-sp-9)}
.lx-intro-stack h2{margin-bottom:var(--lx-sp-4)}
.lx-intro-stack p{max-width:640px}
.lx-h2-solo{margin-bottom:var(--lx-sp-9)}
@media(max-width:767px){.lx-intro-stack,.lx-h2-solo{margin-bottom:var(--lx-sp-7)}}

/* Grade de cards com filete de 1px entre eles */
.lx-cells{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--lx-border);border:1px solid var(--lx-border);border-radius:var(--lx-r-lg);overflow:hidden}
.lx-cells + .lx-cells,.lx-cells + .lx-cells-label{margin-top:var(--lx-sp-8)}
.lx-cells-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:768px){.lx-cells-2,.lx-cells-3,.lx-cells-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.lx-cells-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lx-cells-4,.lx-cells-stats{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:768px) and (max-width:1023px){.lx-cells-3m{grid-template-columns:repeat(3,minmax(0,1fr))}}
.lx-cells-label{display:block;margin-bottom:var(--lx-sp-6)}
/* Numero impar de cards em 2 colunas: o ultimo ocupa a linha, sem buraco. */
@media(min-width:768px){.lx-cells-2 > :last-child:nth-child(odd){grid-column:1 / -1}}

.lx-cell{position:relative;background:var(--lx-bg);padding:var(--lx-sp-7);display:flex;flex-direction:column;gap:var(--lx-sp-5)}
.lx-cell-raised{background:var(--lx-bg-raised)}
.lx-cell-sm{padding:var(--lx-sp-6);gap:var(--lx-sp-3)}
.lx-cell-xs{padding:var(--lx-sp-5);gap:var(--lx-sp-3)}
.lx-cell-g4{gap:var(--lx-sp-4)}
@media(max-width:767px){.lx-cell{padding:var(--lx-sp-6)}.lx-cell-sm,.lx-cell-xs{padding:var(--lx-sp-5)}}
.lx-cell h3{font-family:var(--lx-font-display);font-size:1rem;font-weight:600;line-height:1.3;color:var(--lx-text)}
.lx-cell h3.lx-title{font-size:var(--lx-fs-title);line-height:1.2}
@media(max-width:767px){.lx-cell h3.lx-title{font-size:1.4rem}}
.lx-cell .lx-grow{flex:1}

/* Cabeca de card: icone + kicker + titulo */
.lx-cell-head{display:flex;align-items:flex-start;gap:14px}
.lx-cell-head-c{align-items:center}
.lx-ico{flex:none;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--lx-r-sm);border:1px solid var(--lx-border);background:var(--lx-surface-2);color:var(--lx-lime-500)}
.lx-ico svg{width:20px;height:20px}
.lx-kicker{display:block;margin-bottom:4px;font-family:var(--lx-font-mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--lx-lime-500)}
.lx-eyebrow{font-family:var(--lx-font-mono);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--lx-text-dim)}
.lx-num-lg{font-family:var(--lx-font-mono);font-size:1.4rem;font-weight:500;color:var(--lx-text-dim)}
.lx-num-sm{font-family:var(--lx-font-mono);font-size:.7rem;color:var(--lx-text-dim)}
.lx-dotmark{display:inline-block;flex:none;width:6px;height:6px;border-radius:50%;background:var(--lx-lime-500)}
.lx-dotmark-sm{width:4px;height:4px}
.lx-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}

/* Listas: ponto, check, x */
.lx-split{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--lx-sp-5)}
@media(min-width:768px){.lx-split{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lx-split .lx-micro,.lx-cell .lx-micro.lx-lbl{display:block;margin-bottom:var(--lx-sp-2)}
.lx-list{display:flex;flex-direction:column;gap:6px}
.lx-list li{display:flex;align-items:flex-start;gap:6px;font-size:var(--lx-fs-caption);line-height:1.5;color:var(--lx-text-dim)}
.lx-list li::before{content:"·";flex:none;color:var(--lx-text-dim)}
.lx-list-lime li::before{color:var(--lx-lime-500)}
.lx-list-check li::before{content:"✓";font-size:.7rem;font-weight:700;margin-top:2px;color:var(--lx-lime-500)}
.lx-list-ok li::before{content:"✓";font-size:.75rem;font-weight:700;margin-top:1px;color:var(--lx-positive)}
.lx-list-no li::before{content:"✕";font-size:.7rem;font-weight:700;margin-top:2px;color:var(--lx-danger)}
.lx-list-roomy{gap:8px}

/* Rodape de card com filete */
.lx-divide{padding-top:var(--lx-sp-4);border-top:1px solid var(--lx-border)}
.lx-txt-danger{color:var(--lx-danger)}
.lx-txt-positive{color:var(--lx-positive)}
.lx-out{font-family:var(--lx-font-mono);font-size:.72rem;color:var(--lx-lime-500)}

/* Perfil ("Para quem e") */
.lx-pill{font-family:var(--lx-font-mono);font-size:.62rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--lx-lime-500);border:1px solid var(--lx-lime-500);background:rgba(228,251,12,.05);padding:3px 10px;border-radius:999px}
.lx-sol{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.lx-sol small{font-family:var(--lx-font-mono);font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--lx-text-dim)}
.lx-sol strong{font-family:var(--lx-font-display);font-size:.9rem;font-weight:500;color:var(--lx-text)}

/* Etapas com entregavel a direita */
.lx-steps{display:flex;flex-direction:column;gap:1px;background:var(--lx-border);border:1px solid var(--lx-border);border-radius:var(--lx-r-lg);overflow:hidden}
.lx-steps li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:var(--lx-sp-5);align-items:start;background:var(--lx-bg);padding:var(--lx-sp-6)}
@media(min-width:768px){.lx-steps li{grid-template-columns:48px minmax(0,1fr) auto}}
@media(max-width:767px){.lx-steps li{padding:var(--lx-sp-5)}}
.lx-steps .n{font-family:var(--lx-font-mono);font-size:1.1rem;font-weight:500;line-height:1;color:var(--lx-text-dim)}
.lx-steps h3{font-family:var(--lx-font-display);font-size:1rem;font-weight:600;color:var(--lx-text);margin-bottom:var(--lx-sp-2)}
.lx-steps .lx-caption{line-height:1.65;max-width:520px}
.lx-steps .del{grid-column:1 / -1}
@media(min-width:768px){.lx-steps .del{grid-column:auto;text-align:right}.lx-steps .del .lx-out{max-width:220px;margin-left:auto}}
.lx-steps .del .lx-out{margin-top:4px}

/* FAQ: titulo fixo a esquerda + acordeao nativo (<details name>) */
.lx-faq-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;align-items:start}
@media(min-width:1024px){.lx-faq-grid{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}.lx-faq-side{position:sticky;top:100px}}
.lx-faq-side h2{margin-bottom:var(--lx-sp-4)}
.lx-faq{border:1px solid var(--lx-border);border-radius:var(--lx-r-lg);overflow:hidden}
.lx-faq details{border-bottom:1px solid var(--lx-border)}
.lx-faq details:last-child{border-bottom:0}
.lx-faq summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:var(--lx-sp-6);font-family:var(--lx-font-display);font-size:1rem;font-weight:600;line-height:1.4;color:var(--lx-text);transition:background var(--lx-t-default) var(--lx-ease)}
.lx-faq summary::-webkit-details-marker{display:none}
.lx-faq summary:hover{background:var(--lx-surface-2)}
.lx-faq summary:focus-visible{outline:2px solid var(--lx-lime-500);outline-offset:-2px}
.lx-faq summary::after{content:"+";flex:none;font-family:var(--lx-font-mono);font-size:1.1rem;line-height:1;color:var(--lx-lime-500);transition:transform var(--lx-t-default) var(--lx-ease)}
.lx-faq details[open] summary::after{transform:rotate(45deg)}
.lx-faq details p{padding:0 var(--lx-sp-6) var(--lx-sp-6);color:var(--lx-text-dim);line-height:1.7;animation:lxfaqin var(--lx-t-surface) var(--lx-ease)}
@media(max-width:767px){.lx-faq summary{padding:var(--lx-sp-5)}.lx-faq details p{padding:0 var(--lx-sp-5) var(--lx-sp-5)}}
@keyframes lxfaqin{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* Hero das paginas internas */
.lx-ihero{position:relative;overflow:hidden;padding:160px 0 90px}
@media(max-width:767px){.lx-ihero{padding:130px 0 72px}}
.lx-ihero > .lx-wrap{position:relative;z-index:2}
.lx-ihero-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.lx-ihero-bg .lx-grid-bg{background-image:linear-gradient(rgba(243,253,127,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(243,253,127,.05) 1px,transparent 1px);background-size:56px 56px}
.lx-ihero-bg::after{content:"";position:absolute;inset:auto 0 0 0;height:30%;background:linear-gradient(180deg,transparent,var(--lx-bg))}
.lx-ihero-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:var(--lx-sp-6)}
.lx-ihero-crumb .sep{color:var(--lx-text-dim);opacity:.4}
.lx-ihero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:center}
@media(min-width:1024px){.lx-ihero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:64px}}
.lx-ihero h1{margin-bottom:var(--lx-sp-5)}
.lx-ihero-desc{max-width:480px}
.lx-ihero-desc span{display:block;margin-top:10px;color:var(--lx-text-dim)}
.lx-ihero-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--lx-sp-5)}
.lx-ihero-meta > div{padding:var(--lx-sp-5)}
.lx-ihero-meta .lx-micro{margin-bottom:8px}
.lx-ihero-meta strong{display:block;font-family:var(--lx-font-display);font-size:1.05rem;font-weight:500;color:var(--lx-text)}
@media(max-width:479px){.lx-ihero-meta{gap:var(--lx-sp-3)}.lx-ihero-meta > div{padding:var(--lx-sp-4)}.lx-ihero-meta strong{font-size:.95rem}}
.lx-ihero .lx-hairline{margin-top:var(--lx-sp-9)}
.lx-ihero-solo h1{max-width:980px}
.lx-ihero-desc + .lx-ihero-meta{margin-top:var(--lx-sp-6)}

/* Ilustracoes da marca (SVG inline, wordpress/imagens/) */
.lx-scope svg.lx-art{display:block;width:100%;height:auto}
.lx-ihero-art{position:relative;width:100%;max-width:560px;justify-self:end}
.lx-ihero-art::before{content:"";position:absolute;inset:8% 4%;background:radial-gradient(ellipse at 60% 40%,rgba(228,251,12,.08),transparent 70%);filter:blur(30px);z-index:-1}
@media(max-width:1023px){.lx-ihero-art{justify-self:center;max-width:520px;margin-top:var(--lx-sp-4)}}

/* Diagnostico interativo: perguntas a esquerda + medidor a direita */
.lx-diag-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;align-items:center}
@media(min-width:1024px){.lx-diag-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
.lx-diag-badge{display:inline-flex;margin-bottom:var(--lx-sp-6);padding:6px 14px;border:1px solid var(--lx-border);border-radius:999px;font-family:var(--lx-font-mono);font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:var(--lx-text-dim)}
.lx-diag-grid h2{margin-bottom:var(--lx-sp-4)}
.lx-diag-lead{max-width:520px;margin-bottom:var(--lx-sp-8)}
.lx-diag-card{display:flex;flex-direction:column;align-items:center;gap:var(--lx-sp-6);padding:var(--lx-sp-7);border-radius:var(--lx-r-lg);text-align:center}
.lx-diag-card svg{width:140px;height:140px}
.lx-diag-card .arc{transition:stroke-dashoffset .5s ease,stroke .4s ease}
.lx-diag-label{font-family:var(--lx-font-display);font-size:1rem;font-weight:600;margin-bottom:8px;transition:color .4s ease}
.lx-diag-msg{max-width:240px;margin:0 auto}
.lx-scope .lx-diag-card .lx-btn{width:100%}
.lx-diag-hint{width:100%;padding:12px 0;font-family:var(--lx-font-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--lx-text-dim)}

/* ── BLINDAGEM CONTRA O HELLO-ELEMENTOR ────────────────────────
   O reset do tema estiliza button, [type=button], [type=submit], input,
   select e textarea com seletores (0,1,1)/(0,2,0): borda #c36, fundo
   #c36 no hover/focus, padding .5rem 1rem, raio 3px. Sem isto, qualquer
   <button> ou campo dentro de uma secao Lixum herda o visual do tema.
   Tudo prefixado por .lx-scope para ganhar em especificidade. */
.lx-scope a:hover,.lx-scope a:active{color:inherit}
.lx-scope button:hover,.lx-scope button:focus{background-color:transparent;color:inherit}
.lx-scope .lx-btn{border-radius:var(--lx-r-sm);padding:14px 22px;font-size:.9rem;font-weight:500;line-height:1;text-transform:none}
.lx-scope .lx-btn-sm{padding:10px 16px;font-size:.82rem}
.lx-scope .lx-btn-lg{padding:18px 28px;font-size:1rem}
.lx-scope .lx-btn-primary{background:var(--lx-lime-500);border-color:transparent;font-weight:600}
.lx-scope .lx-btn-primary:hover,.lx-scope .lx-btn-primary:focus{background:var(--lx-lime-400);border-color:transparent}
.lx-scope .lx-btn-secondary{background:var(--lx-surface-2);border-color:var(--lx-border-strong)}
.lx-scope .lx-btn-secondary:hover,.lx-scope .lx-btn-secondary:focus{background:var(--lx-surface-3);border-color:var(--lx-lime-500)}
.lx-scope .lx-btn-ghost{background:transparent;border-color:var(--lx-border)}
.lx-scope .lx-btn-ghost:hover,.lx-scope .lx-btn-ghost:focus{background:var(--lx-accent-soft);border-color:var(--lx-border-lime)}
.lx-scope .lx-field{display:block;width:100%;background-color:var(--lx-surface-2);border:1px solid var(--lx-border);border-radius:var(--lx-r-sm);padding:14px 16px;font-family:var(--lx-font-body);font-size:var(--lx-fs-body);line-height:1.5;color:var(--lx-text)}
.lx-scope .lx-field:hover{border-color:var(--lx-border-strong)}
.lx-scope .lx-field:focus{border-color:var(--lx-lime-500);background-color:var(--lx-surface)}
.lx-scope .lx-field-label{display:block;line-height:1;vertical-align:baseline}
/* Tabela: o tema poe borda cinza em toda celula, listra linhas impares
   e da margin-bottom 15px. */
.lx-scope .lx-ctable{margin:0;font-size:inherit}
.lx-scope .lx-ctable th,.lx-scope .lx-ctable td{border:0;border-bottom:1px solid var(--lx-border);background-color:transparent;vertical-align:middle;line-height:1.5}
.lx-scope .lx-ctable thead th{background-color:var(--lx-surface-2)}
.lx-scope .lx-ctable tr:last-child td{border-bottom:0}

/* ── ALVO DE TOQUE (WCAG 2.5.8 — minimo 24x24px) ───────────── */
@media(max-width:1024px){
  .lx-scope nav a,.lx-scope footer a{display:inline-block;padding-block:6px}
}

/* ── MOVIMENTO REDUZIDO ────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  .lx-scope *,.lx-scope *::before,.lx-scope *::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important
  }
  .lx-ticker-track{animation:none}
  .lx-reveal-on .lx-reveal{opacity:1;transform:none}
}