/* Estilo "sinal" (preto, branco e laranja; tipografia fina e grande). Para reverter: remover pb.css e pb.js do index.html. */
body.pb main,body.pb #app{position:relative;z-index:1}
body.pb{background:#000}
body.pb h1,body.pb h2,body.pb .section-head h3,body.pb .page-title,body.pb .cat-title{font-weight:300;letter-spacing:-.045em}
body.pb .hx-eye,body.pb .pl-eye,body.pb .stat-eye,body.pb .eyebrow{display:flex;align-items:center;gap:10px;letter-spacing:.14em}
body.pb .pl-top .pl-eye{justify-content:center}
body.pb .hx-eye::before,body.pb .pl-eye::before,body.pb .stat-eye::before,body.pb .eyebrow::before{content:"";width:7px;height:7px;background:var(--accent);flex:none}
body.pb .section-head{border-top:1px solid rgba(255,255,255,.12);padding-top:28px;max-width:1200px;margin-left:auto;margin-right:auto}
body.pb .hero.hx{background:transparent}
body.pb .hx-brand,body.pb .hx-prod{background:radial-gradient(90% 120% at 78% 50%,rgba(255,90,10,.14) 0%,transparent 62%)}
body.pb .hx-box,body.pb .pl-hero-art img{will-change:auto}
/* números */
.stats{max-width:1100px;margin:clamp(50px,7vw,110px) auto 0;padding:0 20px}
.stats h3{font:600 clamp(36px,5.4vw,84px)/1 var(--hf);letter-spacing:-.025em;margin:14px 0 36px}
.stat-eye{font:500 12px/1 var(--hf);text-transform:uppercase;color:#fff;margin:0}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 40px}
.stat-grid div{border-top:1px solid rgba(255,255,255,.18);padding:22px 0 30px}
.stat-grid strong{display:block;font:600 clamp(44px,5.6vw,84px)/1 var(--hf);letter-spacing:-.025em}
.stat-grid span{display:block;margin-top:10px;font-size:13px;color:var(--dim)}
/* menu com 2 itens a mais (Plugins, Portfólio): aperta no meio-termo */
@media(min-width:1000px) and (max-width:1320px){.main-nav ul{gap:12px}.main-nav a{font-size:11px;letter-spacing:.04em}#logo-text{font-size:15px;letter-spacing:.24em}.site-header{padding:0 18px}}
/* Cabeçalho numa reta só: nada quebra de linha; botão do painel no mesmo padrão dos links */
@media(min-width:1000px){
  .main-nav a,.main-nav .pill{white-space:nowrap}
  .main-nav .pill{padding:5px 12px;font-size:inherit}
  .logo{flex:0 0 auto}
  #logo-text{white-space:nowrap}
}
@media(min-width:1000px) and (max-width:1400px){
  .site-header{padding:0 20px}
  #logo-text{font-size:13px;letter-spacing:.2em}
  .logo{gap:10px}.logo img{height:42px}
  .nav-row,.main-nav ul{gap:12px}
  .main-nav a{font-size:11px;letter-spacing:.02em}
  .main-nav .pill{padding:4px 9px}
}
@media(min-width:1401px){
  #logo-text{font-size:19px;letter-spacing:.28em}
  .main-nav ul{gap:22px}
}
@media(min-width:1000px){.main-nav .pill{font:700 11px/19.5px var(--hf);letter-spacing:.02em;padding:4px 9px}}
@media(min-width:1000px) and (max-width:1160px){
  .site-header{padding:0 14px}
  #logo-text{font-size:11px;letter-spacing:.12em}
  .logo{gap:8px}.logo img{height:36px}
  .nav-row,.main-nav ul{gap:9px}
  .main-nav a{font-size:10px}.main-nav .pill{font-size:10px;padding:4px 7px}
}
@media(min-width:1161px) and (max-width:1400px){.main-nav .pill{font-size:11px}}
/* cabeçalho e rodapé deixam a moldura aparecer; rodapé mais compacto */
.site-header:not(.scrolled){background:transparent}
.site-footer{background:transparent!important;padding:34px 20px 26px!important;margin-top:24px!important}
.site-footer p{margin-top:16px!important}
/* respiro entre o logo (nome) e o menu: antes um encostava no outro */
@media(min-width:1000px){.site-header{column-gap:36px}.logo{margin-right:8px}}
@media(min-width:1000px) and (max-width:1160px){.site-header{column-gap:20px}.logo{margin-right:0}}
@media(min-width:1401px){#logo-text{font-size:17px;letter-spacing:.22em}.main-nav ul{gap:20px}}
/* cabeçalho só com a logo (sem o nome ao lado) */
/* nome ao lado da logo: visível de novo */
.logo img{height:48px;width:auto}
@media(min-width:1000px) and (max-width:1160px){.logo img{height:42px}}