/* ==========================================================================
   UTM Labs — Blog (29/09/2026). Fundo preto, verde da marca, leitura longa.
   ========================================================================== */
:root{--bg:#050807;--bg2:#0a0f0d;--sf:#0f1613;--sf2:#141d19;--bd:rgba(255,255,255,.08);--bd2:rgba(255,255,255,.14);--tx:#eef5f2;--tx2:#b6c4be;--tx3:#7f8f88;
  --g:#19e39b;--g2:#0fbf80;--gi:#04130d;--r:18px;--w:1200px;--fh:'Sora',system-ui,sans-serif;--fb:'Inter',system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body.bp{margin:0;background:var(--bg);color:var(--tx);font-family:var(--fb);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.bp::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(900px 500px at 12% -10%,rgba(25,227,155,.10),transparent 60%),radial-gradient(700px 420px at 100% 0%,rgba(25,227,155,.05),transparent 60%)}
img{max-width:100%;display:block}
a{color:var(--g);text-decoration:none}
.ic{flex-shrink:0;vertical-align:middle}
.bp-w{width:100%;max-width:var(--w);margin:0 auto;padding:0 24px}
.bp-pular{position:absolute;left:-999px;top:0}.bp-pular:focus{left:12px;top:12px;z-index:99;background:var(--g);color:var(--gi);padding:8px 14px;border-radius:10px}
.bp-prog{position:fixed;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,var(--g),#7dffd0);z-index:60;transition:width .1s linear}

/* ---------- botões (pulsando) ---------- */
.bp-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;border-radius:14px;background:var(--pc,var(--g));color:var(--pt,var(--gi));font:800 .98rem/1.2 var(--fh);letter-spacing:.005em;border:0;cursor:pointer;text-align:center;
  box-shadow:0 14px 32px -14px color-mix(in srgb,var(--pc,var(--g)) 85%,transparent);transition:transform .18s,filter .18s}
.bp-btn:hover{transform:translateY(-2px);filter:brightness(1.07)}
.bp-btn .ic{transition:transform .2s}.bp-btn:hover .ic{transform:translateX(3px)}
.bp-btn-sm{padding:10px 16px;font-size:.86rem;border-radius:12px}
.bp-pulsa{animation:bpPulsa 2.2s ease-in-out infinite}
@keyframes bpPulsa{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--pc,var(--g)) 60%,transparent),0 14px 32px -14px color-mix(in srgb,var(--pc,var(--g)) 85%,transparent)}70%{box-shadow:0 0 0 14px transparent,0 14px 32px -14px color-mix(in srgb,var(--pc,var(--g)) 85%,transparent)}100%{box-shadow:0 0 0 0 transparent,0 14px 32px -14px color-mix(in srgb,var(--pc,var(--g)) 85%,transparent)}}

/* ---------- topo ---------- */
.bp-topo{position:sticky;top:0;z-index:50;background:rgba(5,8,7,.82);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);border-bottom:1px solid var(--bd)}
.bp-topo-in{display:flex;align-items:center;gap:26px;min-height:68px}
.bp-logo{display:inline-flex;align-items:center;gap:10px;font:800 1.12rem var(--fh);color:var(--tx);white-space:nowrap}
.bp-logo em{font-style:normal;color:var(--g)}
.bp-logo-ic{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--g),#0a9e6a);color:var(--gi)}
.bp-nav{display:flex;gap:4px;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.bp-nav a{padding:8px 12px;border-radius:10px;color:var(--tx2);font-weight:600;font-size:.9rem;white-space:nowrap}
.bp-nav a:hover,.bp-nav a.on{color:var(--tx);background:var(--sf2)}

/* ---------- capa da lista ---------- */
.bp-hero{padding:54px 0 34px}
.bp-bread{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.85rem;color:var(--tx3);margin-bottom:18px}
.bp-bread a{color:var(--tx2)}.bp-bread a:hover{color:var(--g)}
.bp-hero h1{font:800 clamp(2rem,4.4vw,3.4rem)/1.08 var(--fh);letter-spacing:-.025em;margin:0 0 16px;max-width:900px}
.bp-hero h1 span{background:linear-gradient(90deg,var(--g),#8effd6);-webkit-background-clip:text;background-clip:text;color:transparent}
.bp-hero-p{color:var(--tx2);font-size:1.12rem;max-width:720px;margin:0 0 26px}
.bp-chips{display:flex;gap:8px;flex-wrap:wrap}
.bp-chips a{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:99px;border:1px solid var(--bd2);color:var(--tx2);font-weight:600;font-size:.88rem;background:var(--sf)}
.bp-chips a:hover{border-color:var(--g);color:var(--tx)}
.bp-chips a.on{background:var(--g);color:var(--gi);border-color:var(--g)}

/* ---------- cartões ---------- */
.bp-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:26px auto}
.bp-card{display:flex;flex-direction:column;background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;transition:transform .22s,border-color .22s,box-shadow .22s}
.bp-card:hover{transform:translateY(-4px);border-color:rgba(25,227,155,.35);box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.bp-card-img{display:block;aspect-ratio:1200/630;overflow:hidden;background:var(--sf2)}
.bp-card-capa{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.bp-card:hover .bp-card-capa{transform:scale(1.04)}
.bp-capa-vazia{display:grid;place-items:center;width:100%;height:100%;aspect-ratio:1200/630;color:var(--pc);background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--pc) 30%,transparent),transparent 60%),var(--sf2)}
.bp-card-tx{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.bp-cat{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;font:700 .72rem var(--fb);letter-spacing:.08em;text-transform:uppercase;color:var(--g);background:rgba(25,227,155,.1);border:1px solid rgba(25,227,155,.25);padding:5px 10px;border-radius:99px}
.bp-card-t{font:700 1.16rem/1.3 var(--fh);margin:0;letter-spacing:-.01em}
.bp-card-t a{color:var(--tx)}.bp-card-t a:hover{color:var(--g)}
.bp-card p{color:var(--tx2);font-size:.94rem;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bp-meta{display:flex;align-items:center;gap:7px;color:var(--tx3);font-size:.82rem;margin-top:auto}
.bp-card-dest{display:grid;grid-template-columns:1.25fr 1fr;margin-top:6px}
.bp-card-dest .bp-card-img{aspect-ratio:auto;min-height:340px}
.bp-card-dest .bp-card-tx{padding:38px;justify-content:center;gap:14px}
.bp-card-dest .bp-card-t{font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.15}
.bp-card-dest p{-webkit-line-clamp:4;font-size:1.02rem}
.bp-pagi{display:flex;gap:8px;justify-content:center;margin:10px 0 40px}
.bp-pagi a{display:grid;place-items:center;min-width:44px;height:44px;border-radius:12px;border:1px solid var(--bd2);color:var(--tx2);font-weight:700}
.bp-pagi a.on,.bp-pagi a:hover{background:var(--g);color:var(--gi);border-color:var(--g)}

/* ---------- vitrine das plataformas ---------- */
.bp-vitrine{padding:70px 0;margin-top:30px;border-top:1px solid var(--bd);background:linear-gradient(180deg,rgba(25,227,155,.04),transparent 70%)}
.bp-sec-cab{text-align:center;max-width:720px;margin:0 auto 36px}
.bp-sec-cab h2{font:800 clamp(1.6rem,3vw,2.3rem)/1.15 var(--fh);letter-spacing:-.02em;margin:12px 0 10px}
.bp-sec-cab p{color:var(--tx2);margin:0}
.bp-selo{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--g);border:1px solid rgba(25,227,155,.3);background:rgba(25,227,155,.08);padding:6px 12px;border-radius:99px}
.bp-vit-grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.bp-vit{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 22px;border-radius:var(--r);background:var(--sf);border:1px solid var(--bd);overflow:hidden}
.bp-vit::before{content:'';position:absolute;inset:0 0 auto 0;height:3px;background:var(--pc)}
.bp-vit::after{content:'';position:absolute;right:-60px;top:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--pc) 22%,transparent),transparent 70%);pointer-events:none}
.bp-vit h3{font:800 1.25rem var(--fh);margin:4px 0 0}
.bp-vit p{color:var(--tx2);font-size:.92rem;margin:0}
.bp-vit .bp-vit-f{color:var(--tx);font-weight:600}
.bp-vit .bp-btn{margin-top:auto}
.bp-prod-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--pc) 16%,transparent);color:var(--pc);border:1px solid color-mix(in srgb,var(--pc) 35%,transparent)}

/* ---------- artigo ---------- */
.bp-art-cab{padding-top:44px;max-width:900px}
.bp-art-cab h1{font:800 clamp(1.9rem,4.2vw,3.05rem)/1.12 var(--fh);letter-spacing:-.025em;margin:16px 0 16px}
.bp-art-lead{font-size:1.2rem;color:var(--tx2);margin:0 0 22px;line-height:1.55}
.bp-art-meta{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;color:var(--tx3);font-size:.88rem;padding-bottom:26px}
.bp-art-meta span{display:inline-flex;align-items:center;gap:7px}
.bp-autor{color:var(--tx);font-weight:700}
.bp-autor-ic{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--g),#0a9e6a);color:var(--gi)}
.bp-autor-ic.g{width:52px;height:52px;flex-shrink:0}
.bp-art-capa-w{max-width:1200px}
.bp-art-capa{width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;border-radius:22px;border:1px solid var(--bd);box-shadow:0 40px 90px -40px rgba(0,0,0,.9)}
.bp-art-capa.bp-capa-vazia{border-radius:22px}
.bp-art-grade{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:56px;margin-top:44px;align-items:start}
.bp-art-corpo{min-width:0;max-width:760px;font-size:1.08rem;color:#dbe6e1}
.bp-art-corpo h2{font:800 1.75rem/1.25 var(--fh);letter-spacing:-.015em;color:var(--tx);margin:2.2em 0 .7em}
.bp-art-corpo h3{font:700 1.3rem/1.3 var(--fh);color:var(--tx);margin:1.8em 0 .6em}
.bp-art-corpo p{margin:0 0 1.15em}
.bp-art-corpo strong{color:var(--tx)}
.bp-art-corpo a{color:var(--g);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.bp-art-corpo a.bp-btn{text-decoration:none;color:var(--pt,var(--gi))}
.bp-art-corpo ul,.bp-art-corpo ol{margin:0 0 1.3em;padding-left:1.3em}
.bp-art-corpo li{margin:.45em 0;padding-left:.2em}
.bp-art-corpo ul li::marker{color:var(--g)}
.bp-art-corpo ol li::marker{color:var(--g);font-weight:800;font-family:var(--fh)}
.bp-art-corpo code{font-size:.88em;background:var(--sf2);border:1px solid var(--bd);padding:2px 7px;border-radius:7px;color:#a7ffd9;word-break:break-word}
.bp-art-corpo blockquote{margin:1.6em 0;padding:4px 0 4px 22px;border-left:3px solid var(--g);font-size:1.15rem;color:var(--tx)}
.bp-fig{margin:2em 0}
.bp-fig img{width:100%;height:auto;border-radius:16px;border:1px solid var(--bd)}
.bp-fig figcaption{font-size:.86rem;color:var(--tx3);margin-top:10px;text-align:center}
.bp-tab{overflow-x:auto;margin:1.6em 0;border:1px solid var(--bd);border-radius:14px}
.bp-tab table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:520px}
.bp-tab th{background:var(--sf2);color:var(--tx);text-align:left;font-weight:700;padding:12px 14px}
.bp-tab td{padding:11px 14px;border-top:1px solid var(--bd);color:var(--tx2)}
.bp-box{margin:1.7em 0;padding:18px 20px;border-radius:14px;border:1px solid;background:var(--sf)}
.bp-box p{margin:0}
.bp-box-t{display:flex;align-items:center;gap:8px;font:800 .8rem var(--fb);letter-spacing:.07em;text-transform:uppercase;margin-bottom:6px}
.bp-box-dica{border-color:rgba(25,227,155,.35)}.bp-box-dica .bp-box-t{color:var(--g)}
.bp-box-atencao{border-color:rgba(251,191,36,.4)}.bp-box-atencao .bp-box-t{color:#fbbf24}
.bp-box-importante{border-color:rgba(96,165,250,.4)}.bp-box-importante .bp-box-t{color:#60a5fa}
.bp-box-exemplo{border-color:rgba(192,132,252,.4)}.bp-box-exemplo .bp-box-t{color:#c084fc}
.bp-faq{display:flex;flex-direction:column;gap:12px}
.bp-faq-it{padding:18px 22px;border-radius:14px;background:var(--sf);border:1px solid var(--bd)}
.bp-faq-it h3{margin:0 0 8px;font-size:1.08rem}
.bp-faq-it p{margin:0 0 .6em;color:var(--tx2)}.bp-faq-it p:last-child{margin:0}

/* cartão de plataforma dentro do texto */
.bp-prod{display:grid;grid-template-columns:auto 1fr;gap:16px 18px;margin:2.2em 0;padding:24px;border-radius:20px;position:relative;overflow:hidden;
  background:linear-gradient(135deg,color-mix(in srgb,var(--pc) 13%,var(--sf)),var(--sf) 60%);border:1px solid color-mix(in srgb,var(--pc) 38%,transparent)}
.bp-prod::after{content:'';position:absolute;right:-80px;bottom:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--pc) 22%,transparent),transparent 70%);pointer-events:none}
.bp-prod-rot{display:block;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--pc);margin-bottom:4px}
.bp-prod-nome{display:block;font:800 1.2rem/1.3 var(--fh);color:var(--tx)}
.bp-prod-tx p{margin:8px 0 10px;color:var(--tx2);font-size:.98rem}
.bp-prod-tx ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px 16px}
.bp-prod-tx li{display:inline-flex;align-items:center;gap:6px;margin:0;padding:0;font-size:.9rem;color:var(--tx)}
.bp-prod-tx li .ic{color:var(--pc)}
.bp-prod .bp-btn{grid-column:2;justify-self:start;position:relative;z-index:1}
.bp-prod-g{padding:32px}
.bp-prod-g .bp-prod-nome{font-size:1.4rem}

.bp-share{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:2.4em 0 1.6em;padding-top:22px;border-top:1px solid var(--bd)}
.bp-share span{color:var(--tx3);font-size:.9rem;margin-right:4px}
.bp-share a,.bp-copiar{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:42px;height:42px;padding:0 12px;border-radius:12px;background:var(--sf2);border:1px solid var(--bd);color:var(--tx);font:600 .85rem var(--fb);cursor:pointer;text-decoration:none!important}
.bp-share a:hover,.bp-copiar:hover{border-color:var(--g);color:var(--g)}
.bp-autor-box{display:flex;gap:16px;align-items:flex-start;padding:22px;border-radius:18px;background:var(--sf);border:1px solid var(--bd)}
.bp-autor-box b{font-family:var(--fh);font-size:1.05rem}
.bp-autor-box p{margin:6px 0 0;color:var(--tx2);font-size:.95rem}

/* lateral */
.bp-lado{position:sticky;top:92px;display:flex;flex-direction:column;gap:18px}
.bp-toc{padding:20px;border-radius:16px;background:var(--sf);border:1px solid var(--bd);max-height:calc(100vh - 360px);overflow:auto}
.bp-toc b{display:flex;align-items:center;gap:8px;font:800 .8rem var(--fb);letter-spacing:.07em;text-transform:uppercase;color:var(--tx3);margin-bottom:10px}
.bp-toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.bp-toc li{counter-increment:t}
.bp-toc a{display:flex;gap:10px;padding:6px 8px;border-radius:9px;color:var(--tx2);font-size:.88rem;line-height:1.35}
.bp-toc a::before{content:counter(t,decimal-leading-zero);color:var(--tx3);font-weight:700;font-size:.78rem;padding-top:1px}
.bp-toc a:hover,.bp-toc a.on{background:var(--sf2);color:var(--tx)}
.bp-toc a.on::before{color:var(--g)}
.bp-lado-prod{display:flex;flex-direction:column;gap:8px;padding:22px;border-radius:16px;background:linear-gradient(160deg,color-mix(in srgb,var(--pc) 15%,var(--sf)),var(--sf));border:1px solid color-mix(in srgb,var(--pc) 40%,transparent)}
.bp-lado-prod b{font:800 1.1rem var(--fh)}
.bp-lado-prod p{margin:0 0 6px;color:var(--tx2);font-size:.92rem}
.bp-rel{margin-top:50px}
.bp-rel h2{font:800 1.8rem var(--fh);letter-spacing:-.015em;margin:0}

/* ---------- rodapé ---------- */
.bp-rodape{border-top:1px solid var(--bd);padding:56px 0 26px;background:#030504;margin-top:0}
.bp-rod-grade{display:grid;grid-template-columns:1.2fr 1.3fr 1fr;gap:44px}
.bp-rodape p{color:var(--tx3);font-size:.92rem;margin:14px 0 18px;max-width:360px}
.bp-rodape h2{font:700 .78rem var(--fb);letter-spacing:.09em;text-transform:uppercase;color:var(--tx3);margin:0 0 12px}
.bp-rodape ul{list-style:none;padding:0;margin:0 0 22px}
.bp-rodape li{margin:8px 0}
.bp-rodape li a{color:var(--tx2);font-size:.93rem}.bp-rodape li a:hover{color:var(--g)}
.bp-rod-prods a{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bp-rod-prods small{color:var(--tx3);font-size:.8rem;width:100%;padding-left:20px;margin-top:-2px}
.bp-dot{width:10px;height:10px;border-radius:50%;background:var(--pc);box-shadow:0 0 12px var(--pc)}
.bp-rod-fim{border-top:1px solid var(--bd);margin-top:20px;padding-top:20px;color:var(--tx3);font-size:.85rem}

/* ---------- responsivo ---------- */
@media (max-width:1060px){
  .bp-art-grade{grid-template-columns:minmax(0,1fr)}
  .bp-lado{position:static;order:-1}.bp-toc{max-height:none}.bp-lado-prod{display:none}
  .bp-vit-grade{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bp-nav{display:none}
}
@media (max-width:900px){
  .bp-grade{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bp-card-dest{grid-template-columns:1fr}.bp-card-dest .bp-card-img{min-height:0;aspect-ratio:1200/630}.bp-card-dest .bp-card-tx{padding:24px}
  .bp-rod-grade{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body.bp{font-size:16px}
  .bp-w{padding:0 18px}
  .bp-topo-in{min-height:60px;gap:12px}.bp-logo{font-size:1rem}.bp-topo .bp-btn{margin-left:auto;padding:9px 13px;font-size:.8rem}
  .bp-hero{padding:34px 0 18px}
  .bp-grade{grid-template-columns:minmax(0,1fr);gap:18px}
  .bp-chips{flex-wrap:nowrap;overflow-x:auto;margin:0 -18px;padding:0 18px 4px;scrollbar-width:none}
  .bp-chips a{white-space:nowrap}
  .bp-vit-grade{grid-template-columns:minmax(0,1fr)}
  .bp-art-cab{padding-top:26px}
  .bp-art-lead{font-size:1.06rem}
  .bp-art-capa{border-radius:14px}
  .bp-art-grade{margin-top:28px;gap:26px}
  .bp-art-corpo{font-size:1.02rem}
  .bp-art-corpo h2{font-size:1.42rem}
  .bp-prod{grid-template-columns:1fr;padding:20px}
  .bp-prod .bp-btn{grid-column:auto;justify-self:stretch}
  .bp-rod-grade{grid-template-columns:1fr;gap:10px}
  .bp-share span{width:100%}
}
@media (prefers-reduced-motion:reduce){.bp-pulsa{animation:none}.bp-card,.bp-card-capa{transition:none}}