/*
 * Hero responsivo: no tablet e no mobile a narrativa segue uma única coluna.
 * Promessa -> contexto -> provas -> ações -> retrato.
 * Essa ordem impede que a imagem interrompa a leitura e mantém o CTA visível
 * antes do retrato, como nas melhores páginas pessoais orientadas à conversão.
 */
.hero-visual .b1{left:25%;right:auto;top:48%;bottom:auto}
.hero-visual .b2{left:auto;right:25%;top:56%;bottom:auto}
.hero-visual .b3{left:25%;right:auto;top:64%;bottom:auto}
.hero-visual .b4{left:auto;right:25%;top:72%;bottom:auto}
.hero-visual .b5{left:25%;right:auto;top:80%;bottom:auto;animation-delay:-1.5s}
.hero-visual .b6{left:auto;right:25%;top:88%;bottom:auto;animation-delay:-2.5s}
.bio-image picture{display:block;width:100%;height:100%}

@media(max-width:900px){
  .hero{display:flex;flex-direction:column;min-height:auto;align-items:stretch}
  .hero-copy{display:contents}
  .hero-copy .chips{order:1}
  .hero-copy h1{order:2}
  .hero-copy>p{order:3}
  .hero-copy .proofs{order:4}
  .hero-copy .buttons{order:5}
  .hero-copy .microproof{order:6}
  .hero-visual{order:7}
}

@media(max-width:580px){
  body{padding-bottom:68px}
  .nav{top:max(12px,env(safe-area-inset-top));left:12px;right:12px;height:72px;padding:0 20px;border-radius:18px}
  .hero{display:flex;flex-direction:column;min-height:auto;padding:112px 18px 58px;gap:20px;overflow:hidden;align-items:stretch}
  .hero-copy{display:contents}
  .hero-copy .chips{order:1;display:flex;flex-wrap:nowrap;overflow-x:auto;margin:0;padding:0 0 4px;scrollbar-width:none}
  .hero-copy .chips::-webkit-scrollbar{display:none}
  .hero-copy .chips a{flex:none;padding:7px 10px;font-size:8px}
  .hero-copy h1{order:2;margin:0;font-size:clamp(35px,10.2vw,43px);line-height:1.03;letter-spacing:-.045em}
  .hero-visual{order:7;position:relative;width:100%;height:clamp(440px,118vw,590px);margin:8px 0 0;overflow:hidden;isolation:isolate;border:1px solid rgba(81,230,145,.28);border-radius:22px;background:radial-gradient(circle at 50% 34%,#123b29 0,#07120d 48%,#030504 82%)}
  .hero-visual picture{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:hidden;border-radius:inherit}
  .hero-visual picture img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 18%;border:0;border-radius:inherit;box-shadow:none;transform:none!important;filter:none;-webkit-mask-image:none!important;mask-image:none!important}
  .hero-visual picture:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,7,.52) 0%,transparent 24%),linear-gradient(180deg,rgba(3,5,4,.08),transparent 24%);pointer-events:none}
  .hero-visual .badge{display:inline-flex!important;align-items:center;position:absolute;z-index:5;max-width:calc(100% - 28px);padding:9px 13px;border-color:rgba(81,230,145,.52);background:rgba(9,20,14,.8);box-shadow:0 9px 26px rgba(0,0,0,.34);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:9px;line-height:1;white-space:nowrap}
  .hero-visual .b1{left:15%;right:auto;top:60%;bottom:auto}
  .hero-visual .b2{left:auto;right:15%;top:66.5%;bottom:auto}
  .hero-visual .b3{left:15%;right:auto;top:73%;bottom:auto}
  .hero-visual .b4{left:auto;right:15%;top:79.5%;bottom:auto}
  .hero-visual .b5{left:15%;right:auto;top:86%;bottom:auto}
  .hero-visual .b6{left:auto;right:15%;top:92.5%;bottom:auto}
  .hero-copy>p{order:3;position:relative;z-index:1;margin:0;padding:0;background:none;font-size:14px;line-height:1.62;color:#c8cfca}
  .hero-copy .proofs{order:4;position:relative;z-index:1;margin:2px 0;gap:10px;font-size:11px}
  .proofs li{display:grid;grid-template-columns:38px 1fr;align-items:center}
  .proofs i{display:grid;place-items:center;width:38px;height:38px;margin:0;padding:0}
  .hero-copy .buttons{order:5;display:grid;grid-template-columns:1fr;gap:10px;width:100%}
  .hero-copy .buttons a{display:block;width:100%;padding:16px 15px;text-align:center}
  .hero-copy .microproof{order:6;margin:2px 0 0;font-size:9px!important;line-height:1.55}
  .sticky-action{right:12px;bottom:max(12px,env(safe-area-inset-bottom));padding:12px 16px;box-shadow:0 10px 28px rgba(81,230,145,.34)}
}
