/* ============================================================
   INTEGRO HOME V3 — branco-dominante + 1 acento azul · Manrope
   Tipografia FINA: 300/400/500 · nunca 600+ em titulo
   Craft premium B2B industrial-tech (AVEVA/Siemens/Stripe)
   "caro pela disciplina, nao pelo enfeite"
   ============================================================ */
.lg-i{fill:var(--azul)}
.lg-t{fill:var(--lg-text,var(--grafite))}
:root{
  --azul:#0070C0;        /* acento unico */
  --azul-d:#015A9C;      /* azul profundo (hover) */
  --azul-l:#5AA0DB;      /* azul claro (eyebrow em navy) */
  --navy:#16263A;        /* banda institucional */
  --navy-2:#0F1B2B;      /* rodape */
  --grafite:#2B2B2B;     /* texto / wordmark do logo */
  --slate:#5D7184;       /* texto secundario */
  --slate-2:#33485F;     /* slate escuro */
  --verde:#0D9B50;       /* SO motivo rede/cadeia (fill/dot/icone) */
  --verde-d:#0A783E;     /* verde-texto AA-safe >=4.5:1 em branco (Gemini) */
  --cardbd:#DDE4EE;      /* borda de card */
  --hair:rgba(22,38,58,.075); /* divisor hairline (quase invisivel · GPT) */
  --hair-2:rgba(22,38,58,.06);
  --bg1:#F7FAFC;         /* fundo claro alternado (sutil) */
  --bg2:#E6F1FB;
  --chipbg:#EAF2FB;
  --chipbd:#CFE2F7;
  --branco:#FFFFFF;
  --fonte:'Manrope',-apple-system,'Segoe UI',Arial,sans-serif;
  /* sombras MUITO sutis — disciplina, nao enfeite */
  --shadow-card:0 1px 2px rgba(22,38,58,.04);
  --shadow-card-h:0 12px 32px rgba(22,38,58,.09);
  --shadow-nav:0 1px 0 var(--hair-2),0 6px 16px rgba(22,38,58,.035);
  /* easing premium */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1); /* Out Expo · reveals premium sem bounce */
  --t-fast:180ms var(--ease);
  --t-base:200ms var(--ease);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{font-family:var(--fonte);font-weight:400;font-size:clamp(1rem,1.1vw,1.125rem);line-height:1.7;color:var(--grafite);background:var(--branco);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"kern" 1,"liga" 1;font-synthesis:none;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:var(--azul);text-decoration:none;transition:color var(--t-fast)}

/* ---- tipografia (FINA, anti-WordArt · escala modular) ---- */
h1,h2,h3{color:var(--grafite);font-weight:400;text-wrap:balance}
h1{font-size:clamp(2.5rem,5vw,3.9rem);font-weight:300;letter-spacing:-.025em;line-height:1.07}
h2{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:400;letter-spacing:-.015em;line-height:1.12}
h3{font-size:clamp(1.25rem,2vw,1.625rem);font-weight:500;letter-spacing:-.01em;line-height:1.25}
.eyebrow{display:inline-block;font-size:clamp(.6875rem,.95vw,.75rem);font-weight:600;letter-spacing:.14em;line-height:1;text-transform:uppercase;color:var(--azul);margin-bottom:16px}
.lead{font-size:clamp(1.0625rem,1.2vw,1.1875rem);color:var(--slate);line-height:1.7;max-width:56ch;text-wrap:pretty}
p{line-height:1.7}

/* ---- layout base (respiro generoso) ---- */
.wrap{max-width:1720px;margin:0 auto;padding:0 clamp(20px,2.5vw,48px)}
section{padding:clamp(56px,6vw,104px) 0}
.sec-head{max-width:720px;margin-bottom:clamp(48px,6vw,64px)}
.sec-head .lead{margin-top:24px}
.center{text-align:center}
.center .sec-head{margin-left:auto;margin-right:auto}

/* ---- botoes (limpos · peso 500 · radius 8) ---- */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--fonte);font-weight:500;font-size:.9375rem;line-height:1;letter-spacing:.005em;border-radius:8px;padding:13px 22px;border:1.5px solid transparent;cursor:pointer;transition:background var(--t-base),color var(--t-base),border-color var(--t-base),transform var(--t-base),box-shadow var(--t-base)}
.btn-azul{background:var(--azul);color:#fff;border-color:var(--azul)}
.btn-azul:hover{background:var(--azul-d);border-color:var(--azul-d);box-shadow:0 6px 18px rgba(0,112,192,.22);transform:translateY(-1px)}
.btn-azul:active{transform:translateY(0);box-shadow:0 2px 8px rgba(0,112,192,.18)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.link-txt{display:inline-flex;align-items:center;gap:6px;font-weight:500;font-size:.9375rem;transition:color var(--t-fast),gap var(--t-base)}
.link-txt svg{width:18px;height:18px;transition:transform var(--t-base)}
.link-txt:hover svg{transform:translateX(3px)}
.link-txt.on-navy{color:var(--azul-l)}
.link-txt.on-navy:hover{color:#fff}
.btn:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--azul);outline-offset:2px;border-radius:6px}
.on-navy .btn:focus-visible,.navy-band a:focus-visible,.navy-band button:focus-visible{outline-color:var(--azul-l)}

/* ---- skip-link ---- */
.skip{position:absolute;left:-9999px;top:auto;z-index:2000}
.skip:focus{left:16px;top:8px;background:var(--azul);color:#fff;padding:10px 16px;border-radius:8px;font-weight:500}

/* ============================================================
   NAV (fixa, slim 68px)
   ============================================================ */
.site-nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.86);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid transparent;transition:box-shadow var(--t-base),border-color var(--t-base),background var(--t-base)}
.site-nav.scrolled{background:rgba(255,255,255,.92);border-bottom:1px solid var(--hair);box-shadow:var(--shadow-nav)}
/* offset quando a barra de admin do WP esta presente (logado) — evita a nav ficar coberta */
body.admin-bar .site-nav{top:32px}
@media screen and (max-width:782px){body.admin-bar .site-nav{top:46px}}
.nav-inner{display:flex;align-items:center;gap:16px;height:68px;max-width:1720px;margin:0 auto;padding:0 clamp(20px,2.5vw,48px)}
.logo-link{flex-shrink:0;display:flex;align-items:center}
.logo-link svg{height:26px;width:auto}
.nav-spacer{flex:1}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a{position:relative;color:var(--slate);font-weight:500;font-size:.9375rem;line-height:1;padding:6px 0;transition:color var(--t-fast)}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1.5px;background:var(--azul);transition:right .26s var(--ease)}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--grafite)}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{right:0}
.nav-right{display:flex;align-items:center;gap:18px}

/* idioma dropdown */
.lang{position:relative}
.lang-btn{display:inline-flex;align-items:center;gap:5px;background:none;border:1px solid transparent;border-radius:6px;color:var(--slate);font-family:var(--fonte);font-weight:500;font-size:.9375rem;padding:6px 8px;cursor:pointer;transition:color var(--t-fast)}
.lang-btn:hover{color:var(--grafite)}
.lang-btn svg{width:14px;height:14px;transition:transform var(--t-base)}
.lang-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.lang-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:120px;background:#fff;border:1px solid var(--hair);border-radius:12px;box-shadow:0 12px 32px rgba(22,38,58,.12);padding:6px;list-style:none;display:none}
.lang-menu.open{display:block}
.lang-menu li button,.lang-menu li a{display:flex;width:100%;align-items:center;justify-content:space-between;gap:8px;background:none;border:none;border-radius:7px;color:var(--slate);font-family:var(--fonte);font-weight:500;font-size:.9375rem;text-align:left;padding:9px 12px;cursor:pointer;transition:background var(--t-fast),color var(--t-fast)}
.lang-menu li [aria-disabled="true"]{color:var(--slate);cursor:not-allowed}
.lang-menu li button:not([aria-disabled]):hover{background:var(--chipbg);color:var(--grafite)}
.lang-menu li button:not([aria-disabled]):focus-visible{background:var(--chipbg);color:var(--grafite)}
.lang-menu li button.on{color:var(--azul-d);font-weight:600}
.lang-menu small{font-size:.6875rem;color:var(--slate);letter-spacing:.04em}

/* hamburguer */
.menu-btn{display:none;background:none;border:1px solid var(--hair);border-radius:8px;padding:9px;cursor:pointer;color:var(--grafite);transition:border-color var(--t-fast),background var(--t-fast)}
.menu-btn:hover{border-color:var(--cardbd);background:var(--bg1)}
.menu-btn svg{width:22px;height:22px}

/* drawer mobile */
.drawer-overlay{position:fixed;inset:0;background:rgba(15,27,43,.4);z-index:1050;opacity:0;visibility:hidden;transition:opacity .25s var(--ease),visibility .25s var(--ease)}
.drawer-overlay.open{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(320px,86vw);background:#fff;z-index:1100;transform:translateX(100%);transition:transform .3s var(--ease);display:flex;flex-direction:column;padding:20px 24px 28px;box-shadow:-16px 0 48px rgba(15,27,43,.16)}
.drawer.open{transform:none}
.drawer-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.drawer-top svg.logo{height:24px;width:auto}
.drawer-close{background:none;border:none;cursor:pointer;color:var(--grafite);padding:6px;transition:color var(--t-fast)}
.drawer-close:hover{color:var(--azul)}
.drawer-close svg{width:24px;height:24px}
.drawer nav{display:flex;flex-direction:column;gap:4px}
.drawer nav a{color:var(--grafite);font-weight:500;font-size:1.0625rem;padding:14px 0;border-bottom:1px solid var(--hair);transition:color var(--t-fast)}
.drawer nav a:hover{color:var(--azul)}
.drawer .btn{margin-top:24px;width:100%;justify-content:center}
.drawer-lang{margin-top:20px;display:flex;gap:8px}
.drawer-lang span{font-size:.875rem;color:var(--slate);font-weight:500;padding:6px 10px;border:1px solid var(--hair);border-radius:6px}
.drawer-lang span.on{color:var(--azul-d);border-color:var(--chipbd);background:var(--chipbg)}

/* ============================================================
   HERO (banda NAVY full-width + imagem raster)
   ============================================================ */
.hero{background:var(--navy);color:#fff;padding:calc(68px + clamp(48px,5vw,76px)) 0 clamp(56px,6vw,88px)}
.hero-grid{display:grid;grid-template-columns:48% 52%;gap:clamp(40px,5vw,64px);align-items:center}
.hero h1{color:#fff;font-weight:300;max-width:14ch;letter-spacing:-.025em;line-height:1.06}
.hero .eyebrow{color:var(--azul-l)}
.hero .sub{margin-top:24px;font-size:clamp(1.0625rem,1.3vw,1.25rem);font-weight:400;line-height:1.6;color:#C7D6E6;max-width:46ch}
.hero-ctas{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:38px}
.hero-figure{margin:0}
.hero-figure img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,.34)}
.hero-figure figcaption{margin-top:14px;font-size:.875rem;font-weight:400;color:#AEC0D2;line-height:1.6;max-width:46ch}

/* ============================================================
   FAIXA-PROVA (CLARA — bg1, numeros grafite peso 600)
   ============================================================ */
.prova{background:var(--bg1);border-bottom:1px solid var(--hair);padding:clamp(48px,6vw,64px) 0}
.prova-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(28px,3vw,40px)}
.prova-cell{text-align:left}
.prova-cell .num{font-size:clamp(1.625rem,2.6vw,2.25rem);font-weight:600;letter-spacing:-.025em;color:var(--grafite);line-height:1.05;font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1,"kern" 1}
.prova-cell .lbl{margin-top:10px;font-size:.9375rem;color:var(--slate);line-height:1.5}
.prova-nota{margin-top:36px;font-size:.8125rem;color:var(--slate);max-width:80ch;line-height:1.6}

/* ============================================================
   4 FORMAS DE GANHAR (branco)
   ============================================================ */
.formas .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:8px}
.card{position:relative;background:#fff;border:1px solid var(--hair);border-radius:14px;padding:clamp(28px,3vw,32px);overflow:hidden;box-shadow:var(--shadow-card);transition:transform var(--t-base),box-shadow var(--t-base),border-color var(--t-base)}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:rgba(0,112,192,.5);transform:scaleX(0);transform-origin:left;transition:transform .28s var(--ease)}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card-h);border-color:var(--cardbd)}
.card:hover::before{transform:scaleX(1)}
.card .ico{width:40px;height:40px;color:var(--azul);margin-bottom:20px}
.card .ico svg{width:40px;height:40px}
.card h3{margin-bottom:10px;color:var(--grafite)}
.card p{font-size:.9375rem;color:var(--slate);line-height:1.65}
.card .chip{display:inline-block;font-size:.6875rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--azul-d);background:var(--chipbg);border:1px solid var(--chipbd);border-radius:999px;padding:4px 11px;margin-bottom:14px;align-self:flex-start}
.card h3{font-size:1.0625rem;line-height:1.3;font-weight:500;letter-spacing:-.005em}
#para-quem .cards{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}

/* ============================================================
   CADEIA MONITORADA (bg1) — fluxo horizontal + conector verde
   ============================================================ */
.cadeia{background:var(--bg1);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.flow{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:8px}
.flow-line{position:absolute;top:30px;left:12%;right:12%;height:1.5px;z-index:0;pointer-events:none}
.stage{position:relative;z-index:1;text-align:center;padding:0 6px}
.stage .node{width:60px;height:60px;margin:0 auto 18px;border-radius:50%;background:#fff;border:1.5px solid var(--azul);display:flex;align-items:center;justify-content:center;color:var(--azul);box-shadow:0 2px 10px rgba(0,112,192,.08);transition:transform var(--t-base),box-shadow var(--t-base)}
.stage:hover .node{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,112,192,.14)}
.stage .node svg{width:28px;height:28px}
.stage h3{font-size:1.0625rem;font-weight:500;margin-bottom:8px;color:var(--grafite);letter-spacing:-.005em}
.stage p{font-size:.9rem;color:var(--slate);line-height:1.6}
.cadeia-fecho{margin-top:clamp(48px,6vw,64px);text-align:center;font-weight:400;color:var(--grafite);font-size:clamp(1.125rem,1.6vw,1.375rem);max-width:42ch;margin-left:auto;margin-right:auto;line-height:1.4;letter-spacing:-.01em}

/* ============================================================
   CTA (banda NAVY — segunda e ultima banda navy)
   ============================================================ */
.cta-band{background:var(--navy);color:#fff;text-align:center}
.cta-band .eyebrow{color:var(--azul-l)}
.cta-band h2{color:#fff;max-width:24ch;margin:0 auto;font-weight:400}
.cta-band .lead{color:#C7D6E6;margin:22px auto 0;text-align:center}
.cta-band .hero-ctas{justify-content:center;margin-top:40px}

/* ============================================================
   RODAPE (navy-2)
   ============================================================ */
.site-foot{background:var(--navy-2);color:#9FB3C8;padding:clamp(64px,8vw,88px) 0 44px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(36px,4vw,48px)}
.foot-brand svg.logo{height:28px;width:auto;margin-bottom:20px}
.foot-brand p{font-size:.9375rem;color:#94A9BE;max-width:30ch;line-height:1.65}
.foot-col h4{font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#C7D6E6;margin-bottom:18px}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.foot-col a{color:#9FB3C8;font-weight:400;font-size:.9375rem;transition:color var(--t-fast)}
.foot-col a:hover{color:#fff}
.foot-legal{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.8125rem;color:#94A9BE}

/* ============================================================
   REVEAL + reduced motion
   ============================================================ */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media(max-width:1023px){
  .formas .cards{grid-template-columns:1fr 1fr}
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .hero h1{max-width:none}
  .hero-figure{order:2}
  .prova-grid{grid-template-columns:1fr 1fr;gap:28px}
  .flow{grid-template-columns:1fr 1fr;gap:40px 28px}
  .flow-line{display:none}
  .foot-grid{grid-template-columns:1fr 1fr;gap:36px}
}
@media(max-width:859px){
  .js .nav-links,.js .nav-right .lang,.js .nav-right>.btn{display:none}
  .js .menu-btn{display:inline-flex}
  .nav-right{gap:10px}
  /* sem JS o drawer nao abre: mantem a navegacao inline acessivel e empilhada */
  .no-js .nav-links{display:flex;flex-wrap:wrap;gap:14px 18px}
  .no-js .menu-btn{display:none}
  .no-js .nav-inner{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:12px}
}
@media(max-width:639px){
  section{padding:clamp(64px,12vw,80px) 0}
  .hero{padding:calc(68px + 56px) 0 64px}
  .formas .cards{grid-template-columns:1fr}
  .prova-grid{grid-template-columns:1fr 1fr;gap:24px}
  .flow{grid-template-columns:1fr;gap:32px}
  .foot-grid{grid-template-columns:1fr;gap:32px}
  .foot-legal{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
  .reveal{opacity:1;transform:none}
  .card:hover{transform:none}
  .btn-azul:hover{transform:none}
  .stage:hover .node{transform:none}
  .link-txt:hover svg{transform:none}
  .nav-links a::after{transition:none}
}

/* ============================================================
   CRAFT LAYER v3.1 — motion · motivo de rede · device-frame ·
   cadeia viva · solution-card  (2026-06-19)
   "movimento comunica, nao decora" · disciplina, nao enfeite
   tudo sob prefers-reduced-motion: no-preference (degrada limpo)
   ============================================================ */

/* ---- 1 · STAGGER REVEAL — cascata sobria em grades ---- */
.reveal{will-change:opacity,transform}
.cards>.reveal:nth-child(2){transition-delay:.05s}
.cards>.reveal:nth-child(3){transition-delay:.10s}
.cards>.reveal:nth-child(4){transition-delay:.15s}
.cards>.reveal:nth-child(5){transition-delay:.20s}
.cards>.reveal:nth-child(6){transition-delay:.25s}

/* ---- 2 · HERO — motivo de rede (dot-grid + glows), sem foto solta ---- */
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero>.wrap{position:relative;z-index:2}
.hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(820px 460px at 82% 10%, rgba(0,112,192,.30), transparent 62%),
    radial-gradient(680px 420px at 4% 98%, rgba(13,155,80,.12), transparent 60%)}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.6;
  background-image:radial-gradient(rgba(255,255,255,.11) 1px, transparent 1.5px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(112% 92% at 18% 26%, #000 0%, transparent 68%);
          mask-image:radial-gradient(112% 92% at 18% 26%, #000 0%, transparent 68%)}

/* ---- 3 · CADEIA VIVA — dashes fluindo + chegada sequencial dos nos ---- */
@media (prefers-reduced-motion:no-preference){
  .flow.in .flow-line line{animation:int-dashflow 1.1s linear infinite}
  @keyframes int-dashflow{to{stroke-dashoffset:-10}}
  .flow.in .flow-line rect{animation:int-diamond 2.4s var(--ease) infinite}
  .flow.in .flow-line rect:nth-of-type(2){animation-delay:.3s}
  .flow.in .flow-line rect:nth-of-type(3){animation-delay:.6s}
  @keyframes int-diamond{0%,100%{opacity:.45}50%{opacity:1}}
  .flow.in .stage .node{animation:int-nodearrive .55s var(--ease) both}
  .flow.in .stage:nth-child(3) .node{animation-delay:.10s}
  .flow.in .stage:nth-child(4) .node{animation-delay:.22s}
  .flow.in .stage:nth-child(5) .node{animation-delay:.34s}
  @keyframes int-nodearrive{from{opacity:0;transform:translateY(9px) scale(.9)}to{opacity:1;transform:none}}
}

/* ---- 4 · DEVICE-FRAME · "Cadeia Monitorada" (exemplificacao viva) ---- */
.device-wrap{margin-top:clamp(40px,5vw,56px)}
.device{position:relative;background:#fff;border:1px solid var(--cardbd);border-radius:18px;
  box-shadow:0 28px 70px rgba(22,38,58,.13);overflow:hidden;max-width:600px;margin:0 auto}
.device-bar{display:flex;align-items:center;gap:7px;padding:13px 18px;border-bottom:1px solid var(--hair);background:var(--bg1)}
.device-bar .pip{width:10px;height:10px;border-radius:50%;background:#D6DEE8}
.device-bar .pip:nth-child(2){background:#E0E7EF}
.device-bar .pip:nth-child(3){background:#E9EFF5}
.device-bar .dtitle{margin-left:10px;font-size:.8125rem;font-weight:600;letter-spacing:-.005em;color:var(--slate-2)}
.device-bar .live{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:.6875rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--verde-d)}
.device-bar .live i{width:7px;height:7px;border-radius:50%;background:var(--verde)}
@media (prefers-reduced-motion:no-preference){
  .device-bar .live i{animation:int-livepulse 1.9s ease-out infinite}
  @keyframes int-livepulse{0%{box-shadow:0 0 0 0 rgba(13,155,80,.45)}70%{box-shadow:0 0 0 7px rgba(13,155,80,0)}100%{box-shadow:0 0 0 0 rgba(13,155,80,0)}}
}
.device-screen{padding:6px 18px 16px}
.trail-row{display:flex;align-items:center;gap:13px;padding:13px 2px;border-bottom:1px solid var(--hair-2)}
.trail-row:last-child{border-bottom:0}
.trail-row .tdot{flex-shrink:0;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(13,155,80,.10);color:var(--verde)}
.trail-row .tdot svg{width:15px;height:15px}
.trail-row .tx{flex:1;min-width:0}
.trail-row .tx b{display:block;font-size:.875rem;font-weight:600;color:var(--grafite);letter-spacing:-.005em;line-height:1.3}
.trail-row .tx span{font-size:.78rem;color:var(--slate)}
.trail-row .tm{flex-shrink:0;font-size:.72rem;font-weight:500;color:var(--slate);font-variant-numeric:tabular-nums;letter-spacing:.01em}
@media (prefers-reduced-motion:no-preference){
  .device-wrap.in .trail-row{opacity:0;animation:int-trailin .55s var(--ease) forwards}
  .device-wrap.in .trail-row:nth-child(1){animation-delay:.20s}
  .device-wrap.in .trail-row:nth-child(2){animation-delay:.42s}
  .device-wrap.in .trail-row:nth-child(3){animation-delay:.64s}
  .device-wrap.in .trail-row:nth-child(4){animation-delay:.86s}
  .device-wrap.in .trail-row:nth-child(5){animation-delay:1.08s}
  @keyframes int-trailin{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
}

/* ---- 5 · SOLUTION-CARD · afordance "Ver solucao" (stretched-link) ---- */
.card:has(.card-go){display:flex;flex-direction:column;position:relative}
.card:has(.card-go)>p{flex:1 1 auto}
.card-go{margin-top:18px;display:inline-flex;align-items:center;gap:7px;font-size:.875rem;font-weight:600;color:var(--azul-d);letter-spacing:.005em;transition:color var(--t-fast)}
.card-go svg{width:16px;height:16px;transition:transform var(--t-base)}
.card:has(.card-go):hover .card-go{color:var(--azul)}
.card:has(.card-go):hover .card-go svg,.card-go:focus-visible svg{transform:translateX(4px)}
.card:has(.card-go) .card-go::after{content:"";position:absolute;inset:0;border-radius:16px}
.card:has(.card-go):focus-within{border-color:var(--azul-l)}
@media (prefers-reduced-motion:reduce){
  .flow.in .flow-line line,.flow.in .flow-line rect,.flow.in .stage .node,
  .device-bar .live i,.device-wrap.in .trail-row{animation:none!important}
  .device-wrap.in .trail-row{opacity:1}
}

/* ---- 6 · GRADES INLINE RESPONSIVAS ----
   Corrige overflow mobile: grids .cards com grid-template-columns inline
   (repeat(3/4,1fr)) venciam as media queries por especificidade. !important
   re-introduz a quebra responsiva em todas as 7 paginas de uma vez. ---- */
@media (max-width:880px){
  .cards[style*="repeat("]{grid-template-columns:1fr 1fr!important}
}
@media (max-width:560px){
  .cards[style*="repeat("]{grid-template-columns:1fr!important}
}
/* split 2-col (1.05fr .95fr) colapsa no mobile (home + produtores) */
@media (max-width:1023px){
  .reveal[style*="1.05fr"]{grid-template-columns:1fr!important;gap:32px!important}
}

/* ============================================================
   BLOG v3 — landing (indice) + post (leitura). Estrutura propria.
   Visuais = motivo de rede on-brand (sem foto solta) ou placeholder.
   ============================================================ */
/* -- filtro de categorias (assuntos) -- */
.blog-cats{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.blog-cats a{font-size:.8125rem;font-weight:500;color:var(--slate);padding:8px 16px;border:1px solid var(--cardbd);border-radius:999px;transition:color var(--t-fast),border-color var(--t-fast),background var(--t-fast)}
.blog-cats a:hover{color:var(--grafite);border-color:var(--azul-l)}
.blog-cats a[aria-current="page"]{background:var(--navy);border-color:var(--navy);color:#fff}
.blog-cats .cat-soon{display:inline-flex;align-items:center;gap:6px;font-size:.8125rem;color:var(--slate);padding:8px 16px;border:1px solid var(--cardbd);border-radius:999px;opacity:.6;cursor:default}
.blog-cats .cat-soon small{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em}

/* -- post em destaque (pilar) -- */
.featured{display:grid;grid-template-columns:1.05fr 1fr;border:1px solid var(--hair);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-card);background:#fff;margin-top:8px}
.featured-visual{position:relative;background:var(--navy);overflow:hidden;min-height:340px;display:grid;place-items:center;isolation:isolate}
.featured-visual::after{content:"";position:absolute;inset:0;z-index:0;opacity:.6;background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1.4px);background-size:24px 24px;-webkit-mask-image:radial-gradient(120% 100% at 50% 40%,#000 0,transparent 72%);mask-image:radial-gradient(120% 100% at 50% 40%,#000 0,transparent 72%)}
.featured-visual .fv-tag{position:relative;z-index:1;font-size:.6875rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--azul-l);border:1px solid rgba(90,160,219,.4);border-radius:999px;padding:7px 16px}
.featured-body{padding:clamp(28px,3.4vw,46px);display:flex;flex-direction:column;justify-content:center}
.featured-body .chip{align-self:flex-start}
.featured-body h3{font-size:clamp(1.375rem,2vw,1.75rem);font-weight:500;letter-spacing:-.01em;line-height:1.2;margin:14px 0 12px;color:var(--grafite)}
.featured-body p{font-size:.9375rem;color:var(--slate);line-height:1.65}
.featured-body .link-txt{margin-top:22px;align-self:flex-start}

/* -- grade de posts -- */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:clamp(36px,4vw,52px)}
.post-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--hair);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-card);transition:transform var(--t-base),box-shadow var(--t-base),border-color var(--t-base);position:relative}
.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-card-h);border-color:var(--cardbd)}
.post-card .pc-visual{height:148px;background:var(--navy);position:relative;display:grid;place-items:center;overflow:hidden}
.post-card .pc-visual::after{content:"";position:absolute;inset:0;opacity:.5;background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1.3px);background-size:20px 20px}
.post-card .pc-visual svg{position:relative;z-index:1;width:34px;height:34px;color:var(--azul-l)}
.post-card .pc-body{padding:24px;display:flex;flex-direction:column;flex:1}
.post-card h3{font-size:1.0625rem;font-weight:500;line-height:1.3;letter-spacing:-.005em;margin:12px 0 8px;color:var(--grafite)}
.post-card p{font-size:.9rem;color:var(--slate);line-height:1.6;flex:1}
.post-meta{display:flex;align-items:center;gap:9px;margin-top:16px;font-size:.75rem;color:var(--slate);font-variant-numeric:tabular-nums}
.post-meta span{display:inline-flex;align-items:center;gap:5px}
.post-card .card-go{margin-top:14px}
.post-card .card-go::after{content:"";position:absolute;inset:0;border-radius:16px}

/* -- post (leitura) -- */
.article{max-width:760px;margin:0 auto}
.article-head{text-align:center;margin-bottom:clamp(36px,4vw,48px)}
.article-head .chip{margin-bottom:18px}
.article-head h1{font-size:clamp(2rem,3.6vw,3rem);line-height:1.1}
.article-head .post-meta{justify-content:center;margin-top:22px;font-size:.8125rem}
.article-hero{aspect-ratio:16/9;border-radius:16px;background:var(--navy);position:relative;overflow:hidden;margin:0 0 clamp(32px,4vw,48px);display:grid;place-items:center;isolation:isolate}
.article-hero::after{content:"";position:absolute;inset:0;opacity:.55;background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1.4px);background-size:26px 26px;-webkit-mask-image:radial-gradient(120% 100% at 50% 35%,#000 0,transparent 72%);mask-image:radial-gradient(120% 100% at 50% 35%,#000 0,transparent 72%)}
.article-hero .ah-note{position:relative;z-index:1;font-size:.8125rem;color:#9FB3C8}
.article-body{font-size:1.0625rem;line-height:1.75;color:var(--slate-2)}
.article-body p{margin-bottom:22px}
.article-body h2{font-size:clamp(1.5rem,2.2vw,1.875rem);font-weight:500;letter-spacing:-.01em;line-height:1.2;color:var(--grafite);margin:44px 0 16px}
.article-body h3{font-size:1.25rem;font-weight:500;color:var(--grafite);margin:32px 0 12px}
.article-body ul,.article-body ol{margin:0 0 22px 0;padding-left:4px;list-style:none}
.article-body li{position:relative;padding:7px 0 7px 28px;color:var(--slate-2)}
.article-body li::before{content:"";position:absolute;left:0;top:15px;width:7px;height:7px;background:var(--azul);transform:rotate(45deg)}
.article-body strong{color:var(--grafite);font-weight:600}
.callout{background:var(--bg1);border:1px solid var(--hair);border-left:3px solid var(--azul);border-radius:0 12px 12px 0;padding:22px 26px;margin:32px 0;font-size:1rem;color:var(--slate-2)}
.callout b{color:var(--grafite)}
.article-faq{margin-top:48px}
.article-faq details{border-top:1px solid var(--hair);padding:18px 0}
.article-faq summary{font-weight:500;color:var(--grafite);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}
.article-faq summary::-webkit-details-marker{display:none}
.article-faq summary::after{content:"+";color:var(--azul);font-size:1.25rem;line-height:1}
.article-faq details[open] summary::after{content:"\2013"}
.article-faq p{margin-top:12px;color:var(--slate);font-size:.9375rem}

@media (max-width:760px){
  .featured{grid-template-columns:1fr}
  .featured-visual{min-height:200px}
  .posts{grid-template-columns:1fr}
}
@media (min-width:761px) and (max-width:1023px){.posts{grid-template-columns:1fr 1fr}}

/* ============================================================
   HERO RING-FLOW (PO aprovado 2026-06-19) — ciclo vetorial animado
   (pulsos no anel · do plano ao grão). SVG no .hero-figure · escopado.
   ============================================================ */
.hero{background:
  radial-gradient(120% 100% at 80% 46%,rgba(0,112,192,.16) 0,rgba(0,112,192,0) 46%),
  radial-gradient(90% 90% at 90% 60%,rgba(90,160,219,.10) 0,rgba(90,160,219,0) 55%),
  linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%)}
.hero::before{display:none!important}
.hero::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;display:block!important;
  background-image:linear-gradient(to right,rgba(90,160,219,.045) 1px,transparent 1px),linear-gradient(to bottom,rgba(90,160,219,.045) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(120% 80% at 72% 50%,#000 0,transparent 78%);mask-image:radial-gradient(120% 80% at 72% 50%,#000 0,transparent 78%)}
.hero-grid{grid-template-columns:44% 56%;align-items:center;gap:clamp(20px,3vw,48px)}
.hero-grid>div:first-child{align-self:center}
.hero-figure{position:relative;margin:0;display:flex;align-items:center;justify-content:center;overflow:visible;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 20%,#000 100%)}
.hero-ring{width:100%;max-width:680px;aspect-ratio:1/1;margin-left:auto}
.hero-ring svg{width:100%;height:100%;display:block;overflow:visible}
.hero-figure .ring-base{fill:none;stroke:rgba(90,160,219,.22);stroke-width:1.1}
.hero-figure .ring-flow{fill:none;stroke:var(--azul);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:30 470;filter:url(#softGlow)}
.hero-figure .spoke{stroke:rgba(90,160,219,.22);stroke-width:1;stroke-dasharray:2 5;opacity:.5}
.hero-figure .hub-ring{fill:none;stroke:var(--azul-l);transform-origin:center;transform-box:fill-box}
.hero-figure .hub-r1{stroke-width:1.2;opacity:.55}
.hero-figure .hub-r2{stroke-width:1;opacity:.32}
.hero-figure .hub-r3{stroke-width:.8;opacity:.18}
.hero-figure .hub-core{fill:var(--azul);filter:url(#coreGlow);transform-origin:center;transform-box:fill-box}
.hero-figure .hub-label{fill:rgba(255,255,255,.52);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;text-anchor:middle}
.hero-figure .node-ring{fill:var(--navy-2);stroke:var(--azul-l);stroke-width:1.2;transform-origin:center;transform-box:fill-box}
.hero-figure .node-dot{fill:var(--azul-l);transform-origin:center;transform-box:fill-box}
.hero-figure .node-glow{fill:none;stroke:var(--azul);stroke-width:2;opacity:0;transform-origin:center;transform-box:fill-box;filter:url(#softGlow)}
.hero-figure .node-label{fill:#fff;font-size:15px;font-weight:600;letter-spacing:.01em;text-anchor:middle}
.hero-figure .node-index{fill:var(--azul-l);font-size:10px;font-weight:700;letter-spacing:.14em;text-anchor:middle}
.hero-figure .net-tick{stroke:var(--verde);stroke-width:1;opacity:.5}
.hero-figure .net-node{fill:var(--verde);opacity:0}
.hero-figure .pulse{offset-path:path("M 320 90 A 230 230 0 0 1 550 320 A 230 230 0 0 1 320 550 A 230 230 0 0 1 90 320 A 230 230 0 0 1 320 90 Z");offset-rotate:0deg}
.hero-figure .pulse circle{filter:url(#coreGlow)}
@media (prefers-reduced-motion:no-preference){
  .hero-figure .ring-flow{animation:hrDash 6.5s linear infinite}
  @keyframes hrDash{to{stroke-dashoffset:-500}}
  .hero-figure .hub-r1{animation:hrBreathe 4.6s var(--ease) infinite}
  .hero-figure .hub-r2{animation:hrBreathe 4.6s var(--ease) infinite .55s}
  .hero-figure .hub-r3{animation:hrBreathe 4.6s var(--ease) infinite 1.1s}
  @keyframes hrBreathe{0%,100%{transform:scale(.92);opacity:.18}50%{transform:scale(1.06);opacity:.55}}
  .hero-figure .hub-core{animation:hrCore 4.6s var(--ease) infinite}
  @keyframes hrCore{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.14);opacity:1}}
  .hero-figure .n0 .node-glow{animation:hrNode 6.5s var(--ease) infinite 0s}
  .hero-figure .n1 .node-glow{animation:hrNode 6.5s var(--ease) infinite 1.625s}
  .hero-figure .n2 .node-glow{animation:hrNode 6.5s var(--ease) infinite 3.25s}
  .hero-figure .n3 .node-glow{animation:hrNode 6.5s var(--ease) infinite 4.875s}
  .hero-figure .n0 .node-dot{animation:hrDot 6.5s var(--ease) infinite 0s}
  .hero-figure .n1 .node-dot{animation:hrDot 6.5s var(--ease) infinite 1.625s}
  .hero-figure .n2 .node-dot{animation:hrDot 6.5s var(--ease) infinite 3.25s}
  .hero-figure .n3 .node-dot{animation:hrDot 6.5s var(--ease) infinite 4.875s}
  @keyframes hrNode{0%{opacity:0;transform:scale(.8)}6%{opacity:.9;transform:scale(1.45)}22%{opacity:0;transform:scale(1.9)}100%{opacity:0;transform:scale(1.9)}}
  @keyframes hrDot{0%,100%{transform:scale(1)}6%{transform:scale(1.5)}24%{transform:scale(1)}}
  .hero-figure .net-node{animation:hrNet 5.2s ease-in-out infinite}
  .hero-figure .net-node.b{animation-delay:1.7s}
  .hero-figure .net-node.c{animation-delay:3.1s}
  @keyframes hrNet{0%,100%{opacity:0}50%{opacity:.7}}
  .hero-figure .p1{animation:hrRun 6.5s linear infinite}
  .hero-figure .p2{animation:hrRun 6.5s linear infinite -2.166s}
  .hero-figure .p3{animation:hrRun 6.5s linear infinite -4.333s}
  @keyframes hrRun{from{offset-distance:0%}to{offset-distance:100%}}
}
@media (prefers-reduced-motion:reduce){
  .hero-figure .ring-flow{stroke-dasharray:none;opacity:.85}
  .hero-figure .hub-core{transform:scale(1.08)}
  .hero-figure .pulse{display:none}
  .hero-figure .net-node{opacity:.6}
}
@media (max-width:1023px){
  .hero-grid{grid-template-columns:1fr}
  .hero-figure{-webkit-mask-image:none;mask-image:none;order:2;margin-top:24px}
  .hero-ring{max-width:400px;margin:0 auto}
}

/* ---- 7 · PROOF STRIP — faixa de prova sob o hero
   (GPT: "a prova aparece tarde" -> evidencia concreta da trilha em 5s) ---- */
.proofstrip{background:var(--bg1);border-bottom:1px solid var(--hair)}
.proofstrip>.wrap{display:flex;align-items:center;gap:10px;padding-top:34px;padding-bottom:34px;flex-wrap:wrap}
.proofstrip .ps-step{display:flex;align-items:center;gap:12px;flex:1 1 0;min-width:188px}
.proofstrip .ps-ico{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;background:#fff;border:1px solid var(--cardbd);color:var(--azul);flex-shrink:0}
.proofstrip .ps-ico svg{width:18px;height:18px}
.proofstrip .ps-tx{font-size:.9rem;font-weight:500;color:var(--slate-2);line-height:1.3;letter-spacing:-.005em}
.proofstrip .ps-arrow{color:var(--verde-d);flex-shrink:0;display:grid;place-items:center}
.proofstrip .ps-arrow svg{width:18px;height:18px}
@media (max-width:820px){
  .proofstrip .ps-arrow{display:none}
  .proofstrip .ps-step{flex:1 1 42%;min-width:150px}
}

/* ---- 9 · MEGAMENU "Plataforma" (nav -> 6 solucoes · estilo Alphatek)
   CSS-only: revela no hover/focus-within (sem JS por arquivo) ---- */
.nav-mega{position:relative;display:flex;align-items:center}
.nav-mega>a{display:inline-flex;align-items:center;gap:5px}
.nav-mega>a .mega-caret{width:13px;height:13px;transition:transform var(--t-base)}
.nav-mega:hover>a .mega-caret,.nav-mega:focus-within>a .mega-caret{transform:rotate(180deg)}
.mega-panel{position:absolute;top:calc(100% + 14px);left:50%;
  transform:translateX(-50%) translateY(6px);
  width:min(540px,92vw);background:#fff;border:1px solid var(--hair);border-radius:16px;
  box-shadow:0 18px 48px rgba(22,38,58,.16);padding:10px;
  display:grid;grid-template-columns:1fr 1fr;gap:2px;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity var(--t-base),transform var(--t-base),visibility var(--t-base);z-index:1200}
.mega-panel::before{content:"";position:absolute;top:-18px;left:0;right:0;height:18px}
.nav-mega:hover .mega-panel,.nav-mega:focus-within .mega-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-panel a{display:flex;align-items:flex-start;gap:11px;padding:11px 12px;border-radius:10px;color:inherit;transition:background var(--t-fast)}
.mega-panel a:hover{background:var(--bg1)}
.mega-panel a::after{display:none} /* anula stretched-link de cards, se herdado */
.mega-ico{width:34px;height:34px;border-radius:8px;flex-shrink:0;display:grid;place-items:center;background:var(--chipbg);color:var(--azul);border:1px solid var(--chipbd)}
.mega-ico svg{width:18px;height:18px}
.mega-tx b{display:block;font-size:.875rem;font-weight:600;color:var(--grafite);letter-spacing:-.005em;line-height:1.25}
.mega-tx small{font-size:.78rem;color:var(--slate);line-height:1.3}
@media (max-width:859px){.nav-mega .mega-panel{display:none}}

/* ---- 8 · BREADCRUMB (paginas de detalhe de solucao, no hero navy) ---- */
.crumbs{display:flex;align-items:center;gap:9px;font-size:.8125rem;font-weight:500;margin-bottom:20px;flex-wrap:wrap}
.crumbs a{color:var(--azul-l);transition:color var(--t-fast)}
.crumbs a:hover{color:#fff}
.crumbs span[aria-current]{color:#C7D6E6}
.crumbs span[aria-hidden]{color:#5D7184}

/* ============================================================
   ONDA 2 · MOBILE POLISH (GPT audit) — hero ring compacto +
   proofstrip como timeline vertical (sem caixas, hairline sutil)
   ============================================================ */
@media (max-width:639px){
  /* hero: ring menor, nao compete com o CTA abaixo da dobra */
  .hero-ring{max-width:300px}
  .hero-figure{margin-top:16px}
  /* proofstrip -> timeline vertical curta */
  .proofstrip>.wrap{flex-direction:column;align-items:stretch;gap:0;padding-top:22px;padding-bottom:22px}
  .proofstrip .ps-step{width:100%;flex:none;min-width:0;gap:14px;padding:12px 0;position:relative}
  .proofstrip .ps-step:not(:last-child)::after{content:"";position:absolute;left:17px;top:48px;bottom:-12px;width:1.5px;background:var(--hair)}
  .proofstrip .ps-ico{width:34px;height:34px;z-index:1}
}

/* ============================================================
   ONDA 3 · EDITORIAL (GPT audit) — ledger numerado (sem cards) p/
   bloco argumentativo + device-frame minimal (menos browser chrome)
   ============================================================ */
/* -- ledger: lista editorial numerada, hairline, zero caixa/icone -- */
.ledger{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,3vw,40px) clamp(40px,5vw,76px);margin-top:clamp(36px,4vw,52px);counter-reset:lg}
.ledger>li{position:relative;padding:22px 0 0 38px;border-top:1px solid var(--hair)}
.ledger>li::before{counter-increment:lg;content:counter(lg,decimal-leading-zero);position:absolute;left:0;top:22px;font-size:.8125rem;font-weight:600;color:var(--azul);font-variant-numeric:tabular-nums;letter-spacing:.02em;line-height:1.4}
.ledger>li b{display:block;font-size:1.0625rem;font-weight:500;color:var(--grafite);letter-spacing:-.005em;line-height:1.3;margin-bottom:8px}
.ledger>li p{font-size:.9375rem;color:var(--slate);line-height:1.65}
@media(max-width:759px){.ledger{grid-template-columns:1fr;gap:0}.ledger>li{padding-top:20px}}
/* -- device-frame minimal: tira os 3 pips de "janela de browser" -- */
.device-bar .pip{display:none}
.device-bar{padding:15px 18px}

/* ============================================================
   ONDA 3b · DRAWER MOBILE PREMIUM (GPT pt.3) — respiro, sem
   divisorias por link (espaco+hover), CTA refinado, backdrop blur
   ============================================================ */
.drawer-overlay{background:rgba(15,27,43,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.drawer{width:min(360px,88vw);padding:24px 24px 30px;box-shadow:-24px 0 64px rgba(15,27,43,.20);border-top-left-radius:20px;border-bottom-left-radius:20px}
.drawer-top{margin-bottom:30px}
.drawer-close{border-radius:9px;padding:8px;transition:background var(--t-fast),color var(--t-fast)}
.drawer-close:hover{background:var(--bg1);color:var(--azul)}
.drawer nav{gap:2px}
.drawer nav a{border-bottom:none;padding:12px;margin:0 -12px;border-radius:10px;font-size:1.0625rem;font-weight:500;letter-spacing:-.01em;color:var(--grafite);transition:background var(--t-fast),color var(--t-fast)}
.drawer nav a:hover{background:var(--bg1);color:var(--azul)}
.drawer .btn{margin-top:22px;width:100%;justify-content:center;border-radius:12px;padding:15px 22px;box-shadow:0 8px 20px rgba(0,112,192,.20)}
.drawer-lang{margin-top:24px;padding-top:22px;border-top:1px solid var(--hair);gap:10px}
.drawer-lang span{padding:7px 14px;border:1px solid var(--cardbd);border-radius:999px;font-size:.8125rem}
.drawer-lang span.on{color:var(--azul-d);background:var(--chipbg);border-color:var(--chipbd)}

/* ============================================================
   ONDA 4b · #para-quem como TABS (canon PADRAO "Tabs Para quem") —
   escolhe o perfil → vê o ganho. CSS-only (radio:checked) · no-JS safe.
   + FAQ "+" gira ao abrir (GPT/Claude audit)
   ============================================================ */
.aud-tabs{margin-top:clamp(36px,4vw,52px)}
.aud-radio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.aud-tablist{display:flex;flex-wrap:wrap;gap:4px 30px;border-bottom:1px solid var(--hair)}
.aud-tablist label{position:relative;cursor:pointer;padding:13px 2px;font-size:.9375rem;font-weight:500;color:var(--slate);transition:color var(--t-fast);white-space:nowrap}
.aud-tablist label:hover{color:var(--grafite)}
.aud-tablist label::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--azul);transform:scaleX(0);transform-origin:left;transition:transform .26s var(--ease)}
.aud-stage{padding-top:clamp(30px,3.5vw,44px)}
.aud-panel{display:none;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:start;max-width:820px}
.aud-ico{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--chipbg);color:var(--azul);border:1px solid var(--chipbd);flex-shrink:0}
.aud-ico svg{width:24px;height:24px}
.aud-panel h3{font-size:clamp(1.25rem,1.7vw,1.55rem);font-weight:500;letter-spacing:-.01em;line-height:1.25;color:var(--grafite);margin:0 0 10px}
.aud-panel p{font-size:1.0625rem;color:var(--slate);line-height:1.65;margin:0;max-width:62ch}
#aud-1:checked~.aud-tablist label[for=aud-1],#aud-2:checked~.aud-tablist label[for=aud-2],#aud-3:checked~.aud-tablist label[for=aud-3],#aud-4:checked~.aud-tablist label[for=aud-4],#aud-5:checked~.aud-tablist label[for=aud-5]{color:var(--grafite);font-weight:600}
#aud-1:checked~.aud-tablist label[for=aud-1]::after,#aud-2:checked~.aud-tablist label[for=aud-2]::after,#aud-3:checked~.aud-tablist label[for=aud-3]::after,#aud-4:checked~.aud-tablist label[for=aud-4]::after,#aud-5:checked~.aud-tablist label[for=aud-5]::after{transform:scaleX(1)}
#aud-1:checked~.aud-stage .aud-panel:nth-child(1),#aud-2:checked~.aud-stage .aud-panel:nth-child(2),#aud-3:checked~.aud-stage .aud-panel:nth-child(3),#aud-4:checked~.aud-stage .aud-panel:nth-child(4),#aud-5:checked~.aud-stage .aud-panel:nth-child(5){display:grid}
#aud-1:focus-visible~.aud-tablist label[for=aud-1],#aud-2:focus-visible~.aud-tablist label[for=aud-2],#aud-3:focus-visible~.aud-tablist label[for=aud-3],#aud-4:focus-visible~.aud-tablist label[for=aud-4],#aud-5:focus-visible~.aud-tablist label[for=aud-5]{outline:2px solid var(--azul);outline-offset:3px;border-radius:4px}
@media(max-width:639px){.aud-panel{grid-template-columns:1fr;gap:14px}.aud-tablist{gap:2px 18px}.aud-tablist label{font-size:.875rem;padding:11px 2px}}
.faq details summary svg{transition:transform var(--t-base)}
.faq details[open] summary svg{transform:rotate(45deg)}

/* N2 · claim do hero promovido (reusa o texto existente · so hierarquia, nao descaracteriza) */
.hero-claim{margin-top:22px;font-size:clamp(1.2rem,1.8vw,1.55rem);font-weight:500;line-height:1.3;letter-spacing:-.01em;color:var(--azul-l);max-width:26ch}
.hero-claim + .sub{margin-top:14px}

/* N1 · faixa de origem industrial (desde 2002 · PO confirmou o fato) */
.origin{background:var(--bg1);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.origin-in{display:flex;align-items:baseline;gap:clamp(22px,3.5vw,52px);padding:clamp(28px,3.5vw,40px) 0;flex-wrap:wrap}
.origin-year{font-size:clamp(1.5rem,2.4vw,2rem);font-weight:600;letter-spacing:-.02em;color:var(--azul-d);font-variant-numeric:tabular-nums;line-height:1;flex-shrink:0}
.origin-tx{font-size:clamp(1rem,1.25vw,1.1875rem);line-height:1.5;color:var(--slate-2);max-width:66ch;margin:0}
.origin-tx strong{color:var(--grafite);font-weight:600}
@media(max-width:639px){.origin-in{gap:10px}}