/* Rodada 2026-07-20: refinamento visual, ordem e correção mobile */
html,body{max-width:100%;overflow-x:clip}
img,video,svg{max-width:100%}
main{display:flex;flex-direction:column;min-width:0}
.hero{order:1}.video-section{order:2}.services{order:3}.method{order:4}.before-after{order:5}.problem{order:6}.portfolio{order:7}.diagnostic{order:8}.hiring{order:9}.community{order:10}.reviews{order:11}.faq{order:12}.final-cta{order:13}

/* Menu azul-escuro e marca nítida */
.site-header{background:rgba(2,13,34,.97);border-color:rgba(57,184,255,.2);box-shadow:0 18px 48px rgba(0,0,0,.38);box-sizing:border-box}
.site-header .brand{width:248px;height:60px;min-width:0}
.site-header .brand img{display:block;width:100%;height:100%;object-fit:contain;object-position:left center;filter:drop-shadow(0 5px 14px rgba(0,0,0,.22));image-rendering:auto}
.site-header nav a{color:#e7f3ff}.site-header nav a:hover{color:var(--green);background:rgba(41,224,121,.08)}
.menu-toggle span{background:#fff}

/* Hero */
.hero h1{font-size:clamp(3.05rem,6.2vw,5.9rem)}
.hero-system{isolation:isolate}
.cosmic-orbit{display:none!important}
.hero-system .phone{z-index:2;animation:phoneBreath 5.8s ease-in-out infinite}
.phone article{animation:phoneCard 4.8s ease-in-out infinite;transform-origin:center}
.phone article:nth-of-type(2){animation-delay:-1.6s}.phone article:nth-of-type(3){animation-delay:-3.2s}
.dashboard{z-index:4;animation:dashboardFloat 5s ease-in-out infinite}
.sales-dashboard{top:auto;right:auto;left:0;bottom:54px;width:210px;padding:17px 20px;transform:rotateY(8deg) rotateZ(-2deg);animation-delay:-2.3s}
.sales-dashboard small{color:#fff;font-weight:900;letter-spacing:.08em}.sales-dashboard strong{font-size:1.65rem;line-height:1.1;white-space:nowrap}
.hero-platforms img{animation-duration:4.6s;will-change:transform}

/* Entenda Melhor */
.video-card .play{width:96px;height:96px;color:#fff;background:linear-gradient(145deg,#16b8ff,#19d77a);border:2px solid rgba(255,255,255,.92);box-shadow:0 0 0 10px rgba(22,184,255,.2),0 0 0 22px rgba(41,224,121,.1),0 20px 55px rgba(0,0,0,.45);font-size:2rem;transition:.3s}
.video-card:hover .play{transform:translate(-50%,-50%) scale(1.08);filter:brightness(1.08)}
.near-sale{text-align:center}.near-sale h3{font-size:clamp(2.15rem,4.2vw,3.65rem);line-height:1.02;margin:42px auto 0}.near-sale h3 span,.near-sale h3 em{display:block}.near-sale h3 em{color:var(--green);font-style:normal}

/* Serviços */
.services .section-head h2{font-size:clamp(2.25rem,4.3vw,4.5rem)}
.services .section-head h2 em{font-style:normal;color:var(--green)}
.services .service-grid .service-image{height:230px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.services .service-grid .service-image img{width:310px;height:260px;max-width:110%;object-fit:contain;object-position:center bottom;transform:scale(1.42);transform-origin:center bottom;filter:drop-shadow(0 22px 32px rgba(0,0,0,.42))}

/* Método e antes/depois */
.steps .step-top img{width:42px;height:42px;flex-basis:42px}
.compare-slide p{color:#fff;background:rgba(3,15,36,.92);margin:0;padding:16px 18px;border-radius:0 0 18px 18px}

/* Problema */
.problem .split{grid-template-columns:.82fr 1.18fr;gap:42px}
.problem-visual-wrap{border-radius:26px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.42)}
.problem-visual-wrap img{display:block;width:100%;height:auto;object-fit:cover}

/* Contratação, comunidade, avaliações e WhatsApp */
.hire-card.individual .hire-heading>img{padding:7px;border-radius:18px;background:linear-gradient(145deg,rgba(22,184,255,.12),rgba(41,224,121,.12));border:1px solid rgba(22,184,255,.22);filter:drop-shadow(0 12px 22px rgba(22,184,255,.25))}
.community-list img{width:42px;height:42px;object-fit:contain;flex:0 0 42px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.26))}
.google-brand-stage{width:125px;height:105px;flex-basis:125px}.google-brand-stage>img{width:94px;height:94px}
.google-proof>div:nth-child(2){gap:0}.google-proof>div:nth-child(2)>span{font-size:1.8rem;line-height:1.1;letter-spacing:.06em;margin-bottom:3px}
.whatsapp-float{overflow:hidden;background:linear-gradient(145deg,#08a9e5,#20d77a);border:2px solid rgba(255,255,255,.8)}
.whatsapp-float img{width:82px;height:82px;max-width:none;object-fit:contain;transform:scale(1.72);filter:drop-shadow(0 5px 12px rgba(0,0,0,.2))}

@keyframes phoneBreath{0%,100%{transform:translate(-50%,-50%) rotateY(-8deg) translateY(0)}50%{transform:translate(-50%,-50%) rotateY(-5deg) translateY(-8px)}}
@keyframes phoneCard{0%,100%{transform:translateX(0);border-color:rgba(255,255,255,.07)}50%{transform:translateX(4px) scale(1.025);border-color:rgba(41,224,121,.4);box-shadow:0 8px 24px rgba(22,184,255,.12)}}
@keyframes dashboardFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}

@media(max-width:980px){
  .site-header nav{background:#04142f;border-color:rgba(57,184,255,.22)}.site-header nav a{color:#e7f3ff}.site-header nav a:hover{background:rgba(41,224,121,.08)}
  .problem .split{grid-template-columns:1fr}.problem .split>div:first-child{text-align:center}.problem-visual-wrap{max-width:780px;margin:auto}
}

@media(max-width:680px){
  html,body{width:100%;overflow-x:clip}
  .site-header{position:fixed;top:8px;left:10px;right:10px;width:auto;max-width:none;height:68px;transform:none;margin:0;padding:7px 10px;gap:8px;border-radius:18px}
  .site-header .brand{width:min(184px,calc(100vw - 86px));height:52px;flex:0 1 auto;overflow:hidden}
  .site-header .brand img{width:100%;height:100%;object-fit:contain}
  .site-header .menu-toggle{margin-left:auto;flex:0 0 44px;width:44px;height:44px}
  .site-header nav{left:0;right:0;width:auto;max-width:100%;box-sizing:border-box;overflow:hidden}
  .container{width:calc(100% - 26px);max-width:100%}
  .hero{padding-top:105px}.hero h1{font-size:clamp(2.28rem,11.7vw,3.25rem)}
  .hero-platforms{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;width:100%;margin:18px 0 0}
  .hero-platforms span{width:100%;height:auto;aspect-ratio:1;max-width:54px;margin:auto;min-width:0}
  .hero-system{height:430px;width:100%;max-width:100%;overflow:visible}
  .hero-system .phone{width:174px;height:344px}
  .dashboard{width:142px;right:0;top:10px;padding:13px}.dashboard strong{font-size:1.55rem}
  .sales-dashboard{left:0;right:auto;top:auto;bottom:54px;width:154px;padding:12px}.sales-dashboard strong{font-size:1.16rem}
  .hero-services-button{bottom:-9px}
  .video-card .play{width:78px;height:78px;box-shadow:0 0 0 8px rgba(22,184,255,.2),0 0 0 16px rgba(41,224,121,.1),0 14px 36px rgba(0,0,0,.42)}
  .near-sale h3{font-size:2.35rem;margin-top:34px}
  .services .section-head h2{font-size:2.55rem}
  .services .service-grid .service-image{height:210px}.services .service-grid .service-image img{width:290px;height:245px;max-width:112%;transform:scale(1.42)}
  .problem .split{gap:28px}.problem .section-label{margin-bottom:6px}.problem h2{font-size:2.25rem}.problem p{font-size:1rem}.problem-visual-wrap{border-radius:18px}
  .before-after .section-head h2{font-size:2.55rem}
  .community-list img{width:38px;height:38px;flex-basis:38px}
  .google-proof>div:nth-child(2)>span{font-size:2rem}.google-brand-stage{height:96px}
  .whatsapp-float{right:15px;bottom:15px;width:62px;height:62px}.whatsapp-float img{width:76px;height:76px}
}

@media(max-width:380px){
  .site-header .brand{width:min(164px,calc(100vw - 78px))}
  .hero h1{font-size:2.18rem}
  .hero-system{height:415px}.dashboard{width:132px}.sales-dashboard{width:145px}.sales-dashboard strong{font-size:1.06rem}
  .hero-platforms span{max-width:46px}
}

@media(prefers-reduced-motion:reduce){.hero-system .phone,.phone article,.dashboard,.hero-platforms img{animation:none!important}}