/* QA v2 — camada final de responsividade, animação e interação.
   Mantida aqui porque index.html ainda carrega este arquivo depois de styles.css.
   O script legado injeta CSS em runtime; por isso os seletores abaixo são mais fortes. */

:root{
  --qa-paper:#fbf7ef;
  --qa-petrol:#063b46;
  --qa-petrol-2:#074f5a;
  --qa-mint:#2ae1c3;
  --qa-gold:#b88451;
  --qa-ink:#062f39;
  --qa-muted:#516c6f;
  --qa-glass:rgba(255,253,248,.72);
  --qa-shadow:0 24px 70px rgba(6,59,70,.13);
  --qa-container:min(1180px,calc(100vw - 40px));
}

html body{
  min-width:320px!important;
  overflow-x:hidden!important;
  background:linear-gradient(180deg,rgba(251,247,239,.90),rgba(251,247,239,.98)),url('https://res.cloudinary.com/dsaftmy0k/image/upload/v1782938554/074EDAA8-A832-4AE4-AFB2-FEF31340035D_ezdryn.png') center top/cover fixed no-repeat!important;
}

html body *{
  box-sizing:border-box;
}

html body .section-wide,
html body .tool-marquee{
  width:var(--qa-container)!important;
  max-width:1180px!important;
}

html body .topbar{
  width:var(--qa-container)!important;
  max-width:1180px!important;
  min-height:66px!important;
  height:auto!important;
  padding:9px 12px!important;
  border-radius:999px!important;
  background:rgba(255,253,248,.78)!important;
  border:1px solid rgba(6,59,70,.12)!important;
  box-shadow:0 18px 54px rgba(6,59,70,.10)!important;
  backdrop-filter:blur(18px)!important;
}

html body .nav{
  gap:clamp(12px,2vw,30px)!important;
}

html body main#inicio section.hero.has-video-bg{
  min-height:clamp(680px,92svh,860px)!important;
  padding-top:clamp(116px,14vh,155px)!important;
  padding-bottom:clamp(48px,8vh,92px)!important;
  display:grid!important;
  align-items:center!important;
}

html body main#inicio section.hero.has-video-bg .hero-bg{
  background:#fbf7ef url('https://res.cloudinary.com/dsaftmy0k/image/upload/v1783106368/1C4EB10B-CE4E-439E-A195-F0061A2268D4_cx8tnj.png') 70% center/cover no-repeat!important;
}

html body main#inicio section.hero.has-video-bg .hero-bg video,
html body main#inicio section.hero.has-video-bg .hero-bg img{
  object-position:70% center!important;
  transform:scale(1.015)!important;
  filter:saturate(1.02) contrast(.98)!important;
}

html body main#inicio section.hero.has-video-bg .hero-bg:after{
  background:linear-gradient(90deg,rgba(251,247,239,.98) 0%,rgba(251,247,239,.92) 38%,rgba(251,247,239,.38) 64%,rgba(251,247,239,.08) 100%),linear-gradient(180deg,rgba(251,247,239,0) 0%,rgba(251,247,239,.84) 100%),radial-gradient(circle at 44% 48%,rgba(42,225,195,.17),transparent 13rem)!important;
}

html body main#inicio section.hero.has-video-bg .hero-copy{
  max-width:min(560px,54vw)!important;
  padding-top:22px!important;
  transform-origin:left center!important;
}

html body main#inicio section.hero.has-video-bg .hero-copy .eyebrow,
html body .section-heading .eyebrow,
html body .about-copy .eyebrow{
  font-size:clamp(.58rem,.8vw,.72rem)!important;
  letter-spacing:clamp(.14em,.6vw,.26em)!important;
}

html body main#inicio section.hero h1{
  font-family:'Poppins',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
  font-size:clamp(4rem,9vw,8.4rem)!important;
  line-height:.82!important;
  letter-spacing:-.082em!important;
  font-weight:900!important;
  animation:qaNameGlow 6s ease-in-out infinite!important;
}

html body main#inicio section.hero .subtitle{
  max-width:520px!important;
  font-size:clamp(1.42rem,2.8vw,2.7rem)!important;
  line-height:1.08!important;
}

html body main#inicio section.hero .lead{
  max-width:500px!important;
  font-size:clamp(.86rem,1.05vw,1rem)!important;
  line-height:1.62!important;
}

html body .button,
html body .top-cta,
html body .footer-cta{
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background .24s ease!important;
}

html body .button:hover,
html body .button:focus-visible,
html body .top-cta:hover,
html body .top-cta:focus-visible,
html body .footer-cta:hover,
html body .footer-cta:focus-visible{
  transform:translateY(-3px)!important;
  box-shadow:0 22px 46px rgba(6,59,70,.20),0 0 0 7px rgba(42,225,195,.13)!important;
  outline:none!important;
}

html body .metrics{
  margin-top:-58px!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  border-radius:24px!important;
  background:rgba(255,253,248,.76)!important;
}

html body .metrics article{
  min-height:112px!important;
  padding:20px!important;
}

html body .delivery-grid,
html body .stack-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

html body .steps{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}

html body .projects{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}

html body .delivery-card,
html body .steps article,
html body .project-card,
html body .stack-grid article,
html body .case-card{
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease,background .28s ease!important;
  will-change:transform!important;
}

html body .delivery-card:hover,
html body .delivery-card:focus-within,
html body .steps article:hover,
html body .steps article:focus-within,
html body .stack-grid article:hover,
html body .stack-grid article:focus-within,
html body .project-card:hover,
html body .project-card:focus-visible,
html body .case-card:hover,
html body .case-card:focus-within{
  transform:translateY(-6px) scale(1.012)!important;
  border-color:rgba(42,225,195,.72)!important;
  box-shadow:0 28px 82px rgba(6,59,70,.18),0 0 0 7px rgba(42,225,195,.12)!important;
  outline:none!important;
}

html body .project-card{
  min-height:270px!important;
  border-radius:24px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
}

html body .project-card p{
  display:block!important;
}

html body .project-card em{
  margin-top:auto!important;
}

html body [data-gsap],
html body .metrics article,
html body .delivery-card,
html body .steps article,
html body .project-card,
html body .stack-grid article,
html body .case-card{
  opacity:0;
  transform:translateY(22px) scale(.985);
  transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease!important;
}

html body .is-visible,
html body [data-gsap].is-visible,
html body .metrics article.is-visible,
html body .delivery-card.is-visible,
html body .steps article.is-visible,
html body .project-card.is-visible,
html body .stack-grid article.is-visible,
html body .case-card.is-visible{
  opacity:1!important;
  transform:translateY(0) scale(1)!important;
}

html body .tool-track,
html body .stack-grid.is-infinite{
  animation-duration:36s!important;
}

html body .tool-track:hover,
html body .stack-grid.is-infinite:hover{
  animation-play-state:paused!important;
}

@keyframes qaNameGlow{
  0%,100%{filter:drop-shadow(0 0 0 rgba(42,225,195,0));}
  45%{filter:drop-shadow(0 12px 24px rgba(42,225,195,.20));}
}

@media(max-width:1120px){
  :root{--qa-container:calc(100vw - 34px)}

  html body .topbar{
    grid-template-columns:auto 48px!important;
  }

  html body .brand strong,
  html body .top-cta{
    display:none!important;
  }

  html body .nav{
    position:fixed!important;
    left:0!important;
    right:0!important;
    top:calc(100% + 10px)!important;
    display:grid!important;
    gap:4px!important;
    padding:12px!important;
    border-radius:24px!important;
    background:rgba(255,253,248,.98)!important;
    border:1px solid rgba(6,59,70,.12)!important;
    box-shadow:0 24px 70px rgba(6,59,70,.16)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-8px)!important;
    transition:.24s ease!important;
  }

  html body .nav.is-open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
  }

  html body .nav a{
    padding:13px 14px!important;
    border-radius:16px!important;
  }

  html body .nav a:after{
    display:none!important;
  }

  html body .projects{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html body .delivery-grid,
  html body .stack-grid,
  html body .steps{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html body .about{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:760px){
  :root{--qa-container:calc(100vw - 30px)}

  html body{
    background-attachment:scroll!important;
  }

  html body .topbar{
    min-height:60px!important;
    padding:7px!important;
  }

  html body .brand-mark,
  html body .menu{
    width:46px!important;
    height:46px!important;
  }

  html body main#inicio section.hero.has-video-bg{
    min-height:clamp(620px,92svh,760px)!important;
    padding-top:100px!important;
    padding-bottom:46px!important;
    align-items:start!important;
  }

  html body main#inicio section.hero.has-video-bg .hero-bg,
  html body main#inicio section.hero.has-video-bg .hero-bg video,
  html body main#inicio section.hero.has-video-bg .hero-bg img{
    object-position:78% top!important;
    background-position:78% top!important;
  }

  html body main#inicio section.hero.has-video-bg .hero-bg:after{
    background:linear-gradient(90deg,rgba(251,247,239,.99) 0%,rgba(251,247,239,.92) 52%,rgba(251,247,239,.33) 82%,rgba(251,247,239,.12) 100%),linear-gradient(180deg,rgba(251,247,239,0) 0%,rgba(251,247,239,.92) 100%)!important;
  }

  html body main#inicio section.hero.has-video-bg .hero-copy{
    max-width:min(100%,350px)!important;
    padding-top:6px!important;
  }

  html body main#inicio section.hero h1{
    font-size:clamp(3.35rem,16vw,5.15rem)!important;
    line-height:.88!important;
  }

  html body main#inicio section.hero .subtitle{
    max-width:300px!important;
    font-size:clamp(1.22rem,5.6vw,1.72rem)!important;
    line-height:1.12!important;
  }

  html body main#inicio section.hero .lead{
    max-width:300px!important;
    font-size:.76rem!important;
    line-height:1.55!important;
  }

  html body .actions{
    display:grid!important;
    max-width:250px!important;
    gap:10px!important;
  }

  html body .button{
    min-height:45px!important;
    justify-content:space-between!important;
    padding:0 17px!important;
    font-size:.66rem!important;
  }

  html body .metrics{
    margin-top:-34px!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    border-radius:22px!important;
  }

  html body .metrics article{
    min-height:98px!important;
    padding:14px 12px!important;
    grid-template-columns:38px 1fr!important;
    gap:3px 9px!important;
    border-bottom:1px solid rgba(6,59,70,.10)!important;
  }

  html body .metrics article:nth-child(2n){
    border-right:0!important;
  }

  html body .metrics article:nth-last-child(-n+2){
    border-bottom:0!important;
  }

  html body .mini-icon,
  html body .line-icon{
    width:38px!important;
    height:38px!important;
  }

  html body .metrics strong{
    font-size:.96rem!important;
  }

  html body .metrics small{
    font-size:.5rem!important;
    line-height:1.18!important;
  }

  html body .about,
  html body .delivery,
  html body .method,
  html body .projects-section,
  html body .stack{
    padding:52px 0!important;
  }

  html body .about h2,
  html body .section-heading h2,
  html body .footer h2{
    font-size:clamp(2rem,9.5vw,3.1rem)!important;
    line-height:1.02!important;
  }

  html body .about-copy p,
  html body .section-heading p{
    font-size:.84rem!important;
    line-height:1.62!important;
  }

  html body .about-asset{
    display:none!important;
  }

  html body .delivery-grid,
  html body .stack-grid,
  html body .steps{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  html body .delivery-card,
  html body .steps article,
  html body .stack-grid article{
    min-height:auto!important;
    padding:22px!important;
  }

  html body .projects{
    display:flex!important;
    grid-template-columns:none!important;
    gap:14px!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain!important;
    scroll-snap-type:x mandatory!important;
    padding:2px 16px 18px!important;
    margin-inline:-16px!important;
  }

  html body .project-card{
    flex:0 0 min(84vw,310px)!important;
    min-height:270px!important;
    scroll-snap-align:start!important;
  }

  html body .footer{
    grid-template-columns:1fr!important;
    padding:52px 16px 84px!important;
  }

  html body .float-whats{
    width:56px!important;
    height:56px!important;
    right:16px!important;
    bottom:16px!important;
  }
}

@media(max-width:390px){
  :root{--qa-container:calc(100vw - 26px)}

  html body main#inicio section.hero.has-video-bg{
    min-height:640px!important;
  }

  html body main#inicio section.hero.has-video-bg .hero-copy{
    max-width:292px!important;
  }

  html body main#inicio section.hero h1{
    font-size:3.32rem!important;
  }

  html body main#inicio section.hero .lead{
    max-width:278px!important;
    font-size:.72rem!important;
  }

  html body .actions{
    max-width:230px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  html body *,
  html body *:before,
  html body *:after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }

  html body [data-gsap],
  html body .metrics article,
  html body .delivery-card,
  html body .steps article,
  html body .project-card,
  html body .stack-grid article,
  html body .case-card{
    opacity:1!important;
    transform:none!important;
  }
}