/* Margem v3 (08/10/2026): uma linha de margem para o site inteiro, em qualquer largura.
   --rs-edge e a distancia da borda ate o conteudo: a sangria (16/32/48) ou, acima de 1696 px,
   o que sobra para centralizar 1600 px. Hero, navbar, "Para quem fazemos" e rodape seguem a mesma linha.
   Carregada depois de margem-v2.css. */

:root{--rs-edge:max(var(--rs-gutter),calc((100% - var(--rs-max))/2))}

/* Hero: o texto sai da coluna centralizada e encosta na mesma linha das outras laudas */
.hero-v48.central-hero{padding-inline:var(--rs-edge)}
@media(min-width:1024px){
 .hero-v48 .hero-center{justify-self:start;max-width:640px}
}
@media(max-width:1023px){.hero-showcase{margin-inline:calc(-1*var(--rs-edge))}}

/* Para quem fazemos: a wrap tinha 48 px de padding dentro dos 1600 px */
.audience-v50-wrap{width:auto;max-width:none;margin-inline:0;padding-inline:var(--rs-edge)}

/* Navbar: o logo e o CTA ficam na mesma linha do conteudo.
   Pilula (subpaginas e rolagem): a caixa sai 24 px para fora, o logo fica na linha. */
@media(min-width:1024px){
 .header.site-nav{left:max(8px,calc(var(--rs-edge) - 24px));right:max(8px,calc(var(--rs-edge) - 24px))}
 .nav-shell{max-width:none;padding-inline:23px}
 .is-hero-top.refinement-v48 .header.site-nav{left:var(--rs-edge);right:var(--rs-edge)}
 .is-hero-top.refinement-v48 .nav-shell{padding-inline:0}
}

/* Navbar sobre o hero preto */
.is-hero-top.refinement-v48 .site-nav,.is-hero-top.refinement-v48 .nav-shell{background:transparent}
.is-hero-top.refinement-v48 .nav-shell{min-height:64px}
.is-hero-top.refinement-v48 .site-nav nav>a,.is-hero-top.refinement-v48 .site-nav nav summary{color:#c9c4ba;position:relative;transition:color var(--rs-fast,160ms) ease}
.is-hero-top.refinement-v48 .site-nav nav>a:after,.is-hero-top.refinement-v48 .site-nav nav summary:after{content:'';position:absolute;left:0;right:0;bottom:-8px;height:1px;background:#f01e41;transform:scaleX(0);transform-origin:left;transition:transform 180ms cubic-bezier(.22,1,.36,1)}
.is-hero-top.refinement-v48 .site-nav nav>a:hover,.is-hero-top.refinement-v48 .site-nav nav summary:hover,.is-hero-top.refinement-v48 .site-nav nav>a[aria-current=page]{color:#fff}
.is-hero-top.refinement-v48 .site-nav nav>a:hover:after,.is-hero-top.refinement-v48 .site-nav nav summary:hover:after{transform:scaleX(1)}
.is-hero-top.refinement-v48 .site-nav nav>a:focus-visible,.is-hero-top.refinement-v48 .site-nav nav summary:focus-visible,.is-hero-top.refinement-v48 .nav-diagnosis:focus-visible{outline:2px solid #f01e41;outline-offset:8px;border-radius:4px}
@media(min-width:1024px){
 .is-hero-top.refinement-v48 .site-nav nav{gap:32px}
}

/* "Juntos para vender." no vermelho da marca */
.hero-v48 .hero-center h1 em{color:#f01e41}

/* Waves pontilhadas atras do hero preto (hero-waves.js) */
.hero-v48.central-hero{position:relative;isolation:isolate}
.hero-waves{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.55;-webkit-mask-image:linear-gradient(0deg,#000 0,#000 18%,transparent 62%);mask-image:linear-gradient(0deg,#000 0,#000 18%,transparent 62%)}
.hero-waves canvas{display:block;width:100%!important;height:100%!important}
.hero-v48 .hero-center,.hero-v48 .hero-showcase{position:relative;z-index:1}
@media(max-width:1023px){.hero-waves{opacity:.4}}
@media(prefers-reduced-motion:reduce){.hero-waves{background-image:radial-gradient(rgba(240,30,65,.45) 1.5px,transparent 1.5px);background-size:24px 24px;-webkit-mask-image:radial-gradient(ellipse 60% 50% at 25% 80%,#000 8%,transparent 76%);mask-image:radial-gradient(ellipse 60% 50% at 25% 80%,#000 8%,transparent 76%)}.hero-waves canvas{display:none}}

/* Criacao com uma funcao: a faixa sangra a tela, o titulo e o link voltam para a linha */
.hive-stage .projects-heading,.hive-stage-top,.hive-stage-bottom{width:auto;max-width:none;margin-inline:var(--rs-edge)}
.hive-journey .wrap{width:auto;max-width:none;margin-inline:var(--rs-edge)}
.hive-journey .work-directory-link{max-width:none;margin-inline:0}

/* Celular e tablet: o logo tambem fica na linha da sangria */
@media(max-width:1023px){
 .header.site-nav{left:8px;right:8px}
 .nav-shell{padding-inline:calc(var(--rs-gutter) - 9px)}
 .is-hero-top.refinement-v48 .header.site-nav{left:var(--rs-gutter);right:var(--rs-gutter)}
 .is-hero-top.refinement-v48 .nav-shell{padding-inline:0;border-color:transparent}
}

/* Parede do hero: os cards sao so animacao, nao levam a lugar nenhum (08/10/2026) */
.hero-showcase .showcase-tile{cursor:default}
.hero-showcase .showcase-tile:hover img{transform:none}
.hero-showcase .showcase-tile:active{filter:none}
/* Cards animados mais abaixo (resultados e "Para quem fazemos") tambem nao levam a lugar nenhum */
.impact-case,.audience-clip{cursor:default}