/* ============================================================
   ITWV — RESPONSIVIDADE PROFISSIONAL V2
   Carregado depois do CSS principal para neutralizar tamanhos fixos
   acumulados durante o protótipo.
   ============================================================ */

html{
  font-size:var(--edit-font-base,clamp(16px,calc(14.5px + .27vw),21px))!important;
  overflow-x:hidden!important;
  text-size-adjust:100%;
  -webkit-text-size-adjust:100%;
}
body{min-width:0!important;overflow-x:hidden!important}
img,svg,video,canvas{max-width:100%;height:auto}
main{overflow:hidden}
.wrap{
  width:min(calc(100% - (2 * var(--edit-gutter-large,clamp(56px,5.5vw,132px)))),var(--edit-site-max-width,1360px))!important;
  max-width:var(--edit-site-max-width,1360px)!important;
  margin-inline:auto!important;
}
section{min-width:0;position:relative;isolation:isolate}

/* ============================================================
   LIMPEZA — remove a linha horizontal/artefato que atravessava a tela
   ============================================================ */
.tela2-solutions,
.tela2-solutions>.wrap,
.tela2-head,
.tela2-grid{
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.tela2-solutions{overflow:clip!important}
.tela2-solutions::before,
.tela2-solutions::after,
.tela2-head::before,
.tela2-head::after,
.tela2-grid::before,
.tela2-grid::after{display:none!important;content:none!important}

/* evita que linhas animadas de diagramas escapem para outras seções */
.hero,.itwv-about-v3,.zadara-v4,.clients-v8,.cases-v8,.contact-dark-final{overflow:clip!important}

/* ============================================================
   TIPOGRAFIA FLUIDA
   ============================================================ */
body{font-size:1rem!important}
p,li{font-size:clamp(.88rem,.18vw + .84rem,1rem)!important}
.nav-links,.nav-actions{font-size:clamp(.78rem,.12vw + .73rem,.9rem)!important}
.eyebrow,.tela2-kicker,.tela2-label,.itwv3-kicker,.zadara-kicker,
.clients-v8-head>span,.cases-v8-head>span,.contact-dark-kicker{
  font-size:clamp(.65rem,.12vw + .61rem,.78rem)!important;
}
.hero h1{font-size:var(--edit-hero-title,clamp(2.35rem,3.8vw,4.65rem))!important;line-height:.99!important;overflow-wrap:normal!important}
.tela2-head h2,.clients-v8-head h2,.cases-v8-head h2,
.itwv3-content h2,.zadara-head h2,.contact-dark-copy h2{
  font-size:var(--edit-section-title,clamp(2.05rem,2.9vw,3.55rem))!important;
  line-height:1.02!important;
}
.tela2-body h3,.case-v8-copy h3{font-size:var(--edit-card-title,clamp(1.08rem,1.05vw,1.42rem))!important;line-height:1.12!important}
.tela2-body p,.tela2-body li,.case-v8-copy p,
.itwv3-lead,.itwv3-copy,.zadara-intro,.contact-dark-copy>p{
  font-size:clamp(.86rem,.13vw + .82rem,.97rem)!important;
  line-height:1.58!important;
}
.tela2-body li{line-height:1.45!important}
small{font-size:max(.68rem,12px)!important}

/* ============================================================
   HEADER
   ============================================================ */
.ms-header{height:auto!important;min-height:68px!important}
.ms-nav{min-height:68px!important;height:auto!important;gap:clamp(16px,2vw,34px)!important}
.brand{flex:0 0 auto!important}.brand img{width:clamp(96px,6vw,126px)!important;height:50px!important}
.nav-links{gap:clamp(14px,1.5vw,28px)!important;white-space:nowrap}
.nav-actions{white-space:nowrap}.nav-cta{border-radius:999px!important;padding:.62rem 1.1rem!important}
.menu{color:inherit;cursor:pointer;padding:8px!important}

/* MENU MOBILE */
.itwv-mobile-menu{position:fixed;z-index:89;top:68px;left:0;right:0;max-height:0;overflow:hidden;background:rgba(3,7,14,.98);border-bottom:0!important;transition:max-height .28s ease;display:none}
.itwv-mobile-menu.open{max-height:520px;border-bottom:1px solid rgba(255,255,255,.10)!important}.itwv-mobile-menu-inner{display:grid;padding:16px max(18px,calc((100vw - 1600px)/2));gap:4px}
.itwv-mobile-menu a{display:flex;align-items:center;min-height:48px;padding:0 14px;color:#fff;border-radius:10px;font-weight:700;font-size:1rem!important}
.itwv-mobile-menu .mobile-cta{margin-top:8px;justify-content:center;background:linear-gradient(135deg,#126ee8,#7448ef)}
body.menu-open{overflow:hidden!important}

/* ============================================================
   HERO
   ============================================================ */
.hero{min-height:0!important}
.hero-in{min-height:clamp(560px,68vh,790px)!important;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr)!important;gap:clamp(28px,3.2vw,56px)!important;padding-block:clamp(44px,6vh,88px)!important}
.hero-card{width:min(100%,610px)!important;padding:clamp(30px,3vw,50px)!important}
.hero p{font-size:clamp(.94rem,.16vw + .9rem,1.08rem)!important;line-height:1.55!important}
.visual-stack{width:100%!important;max-width:760px!important;margin-inline:auto!important;height:clamp(370px,31vw,500px)!important}.glass{max-width:100%!important}
.glass h3{font-size:clamp(1rem,.55vw + .65rem,1.3rem)!important}.glass p,.flow span{font-size:clamp(.72rem,.12vw + .69rem,.86rem)!important}

/* SOLUÇÕES */
.tela2-solutions{padding-block:clamp(58px,5vw,92px)!important}
.tela2-head{max-width:100%!important;margin-bottom:clamp(26px,2vw,38px)!important}
.tela2-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(18px,1.7vw,30px)!important}
.tela2-card{min-width:0!important;height:auto!important;min-height:100%!important}
.tela2-art{height:clamp(175px,13vw,245px)!important}.tela2-body{padding:clamp(22px,2vw,32px)!important}

/* ITWV */
.itwv3-wrap{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)!important;gap:clamp(34px,5vw,84px)!important;align-items:center!important}.itwv3-content,.itwv3-quote{min-width:0!important}

/* ZADARA */
.zadara-head{grid-template-columns:1fr!important}.zadara-service-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.zadara-v5 .zadara-model-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:stretch!important}.zadara-v5 .zadara-model-card{min-width:0!important;overflow:hidden!important}
.zadara-v5 .platform-mini-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.zadara-v5 .elastic-map-v6{width:100%!important;max-width:100%!important;overflow:hidden!important}
.zadara-v5 .elastic-map-body{grid-template-columns:minmax(88px,.72fr) minmax(150px,1.12fr) minmax(125px,.95fr)!important}
.zadara-v5 .zadara-model-card h3{font-size:clamp(1.05rem,.7vw + .58rem,1.45rem)!important}.zadara-v5 .zadara-model-card>p{font-size:clamp(.78rem,.12vw + .75rem,.9rem)!important}

/* CLIENTES */
.clients-v8-logos{grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:clamp(12px,1.2vw,20px)!important;max-width:1360px!important}
.client-v8,.client-v8.almt-logo,.client-v8.igepps-logo{aspect-ratio:1/1!important;width:100%!important;height:auto!important;min-height:0!important;padding:9px!important;border-radius:18px!important;overflow:hidden!important}
.client-v8 img,.client-v8.almt-logo img,.client-v8.igepps-logo img{width:100%!important;height:100%!important;max-width:none!important;object-fit:contain!important;object-position:center!important;transform:none!important;padding:0!important}
.clients-v8-logos .client-v8:nth-child(2),.clients-v8-logos .client-v8:nth-child(4){padding:0!important}.clients-v8-logos .client-v8:nth-child(2) img,.clients-v8-logos .client-v8:nth-child(4) img{object-fit:cover!important}

/* CASES */
.cases-v8-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:clamp(16px,1.4vw,24px)!important}.case-v8{min-width:0!important;height:auto!important;min-height:0!important}.case-v8-copy{min-height:0!important;flex:1}.case-v8-copy h3{max-width:16ch!important}.case-v8-art{height:clamp(150px,11vw,205px)!important}

/* CONTATO */
.contact-dark-grid{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr)!important;gap:clamp(36px,5vw,80px)!important}.contact-dark-form{min-width:0!important}.contact-dark-fields{grid-template-columns:repeat(2,minmax(0,1fr))!important}input,select,textarea{min-width:0!important;max-width:100%!important;font-size:.92rem!important}.contact-dark-form label{font-size:.78rem!important}

/* FOOTER */
.footer-dark-grid{grid-template-columns:minmax(230px,1.4fr) repeat(3,minmax(150px,1fr))!important;gap:clamp(30px,4vw,64px)!important}.footer-dark-col a,.footer-dark-col span,.footer-dark-brand p{font-size:.84rem!important}

/* ============================================================
   MONITORES GRANDES
   ============================================================ */
@media (min-width:1600px){
  .hero-card{max-width:680px!important}.tela2-grid{gap:30px!important}.tela2-body{padding:30px 32px!important}
  .clients-v8-logos{max-width:1360px!important}.case-v8-copy{padding:26px!important}
}

/* NOTEBOOK / MONITOR MÉDIO */
@media (max-width:1366px){
  .wrap{
    width:calc(100% - (2 * clamp(52px,5vw,72px)))!important;
    max-width:1240px!important;
  }
  .hero-in{gap:30px!important}
  .hero-card{padding:34px 36px!important}
  .tela2-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important}
  .clients-v8-logos{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .cases-v8-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .zadara-v5 .zadara-model-grid{grid-template-columns:1fr!important}
}

/* NOTEBOOK COM LARGURA MENOR — troca grids antes de apertar conteúdo */
@media (max-width:1180px){
  .wrap{
    width:calc(100% - (2 * var(--edit-gutter-tablet,clamp(28px,4vw,52px))))!important;
    max-width:none!important;
  }
  .tela2-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .zadara-service-grid{grid-template-columns:1fr 1fr!important}
}

/* TABLET / NOTEBOOK ESTREITO */
@media (max-width:1040px){
  .nav-links,.nav-actions{display:none!important}.menu{display:block!important;margin-left:auto!important}.itwv-mobile-menu{display:block}
  .hero-in{grid-template-columns:1fr!important;min-height:0!important;padding-block:52px!important}.hero-card{max-width:760px!important;margin-inline:auto!important}
  .visual-stack{display:grid!important;height:auto!important;max-width:760px!important;grid-template-columns:1fr 1fr!important;gap:14px!important}.visual-stack .glass{position:relative!important;inset:auto!important;transform:none!important;width:auto!important;height:auto!important;min-height:160px!important}.visual-stack .glass.one{grid-column:1/-1!important}.visual-stack .glass.two,.visual-stack .glass.three{grid-column:auto!important}
  .itwv3-wrap{grid-template-columns:1fr!important}.zadara-service-grid{grid-template-columns:1fr 1fr!important}.zadara-service-grid .zadara-card:last-child{grid-column:1/-1!important}.contact-dark-grid{grid-template-columns:1fr!important}.footer-dark-grid{grid-template-columns:1fr 1fr!important}
}

/* TABLET */
@media (max-width:768px){
  html{font-size:16.5px!important}.wrap{width:calc(100% - (2 * var(--edit-gutter-tablet,28px)))!important}section{padding-left:0!important;padding-right:0!important}
  .tela2-grid{grid-template-columns:1fr!important}.zadara-service-grid{grid-template-columns:1fr!important}.zadara-service-grid .zadara-card:last-child{grid-column:auto!important}.zadara-v5 .platform-mini-grid{grid-template-columns:1fr!important}.zadara-v5 .elastic-map-body{grid-template-columns:1fr!important;gap:12px!important}.zadara-v5 .elastic-sources,.zadara-v5 .elastic-services{grid-template-columns:repeat(3,minmax(0,1fr))!important}.zadara-v5 .elastic-links{display:none!important}
  .clients-v8-logos{grid-template-columns:repeat(2,minmax(0,1fr))!important}.cases-v8-grid{grid-template-columns:1fr!important}.contact-dark-fields{grid-template-columns:1fr!important}.contact-full{grid-column:auto!important}.footer-dark-grid{grid-template-columns:1fr 1fr!important}
}

/* CELULAR */
@media (max-width:560px){
  html{font-size:16.5px!important}.wrap{width:calc(100% - (2 * var(--edit-gutter-small,18px)))!important}.ms-header,.ms-nav{min-height:62px!important}.itwv-mobile-menu{top:62px}.brand{border-right:0!important;padding-right:0!important}.brand img{width:94px!important;height:42px!important}
  .hero-in{padding-block:28px 38px!important}.hero-card{padding:25px 21px!important;border-radius:16px!important}.hero h1{font-size:clamp(2.15rem,10.8vw,2.75rem)!important;line-height:1!important}.hero p{font-size:1rem!important}
  .actions{display:grid!important;grid-template-columns:1fr!important}.primary,.secondary{justify-content:center!important;text-align:center!important;min-height:48px!important}
  .visual-stack{grid-template-columns:1fr!important}.visual-stack .glass.one,.visual-stack .glass.two,.visual-stack .glass.three{grid-column:1!important;min-height:0!important;padding:20px!important}
  .tech-marquee-group span{font-size:.72rem!important}
  .tela2-head h2,.clients-v8-head h2,.cases-v8-head h2,.itwv3-content h2,.zadara-head h2,.contact-dark-copy h2{font-size:clamp(2rem,9vw,2.5rem)!important}
  .tela2-body h3,.case-v8-copy h3{font-size:1.28rem!important}.tela2-body p,.tela2-body li,.case-v8-copy p{font-size:.95rem!important}
  .clients-v8-logos{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.client-v8,.client-v8.almt-logo,.client-v8.igepps-logo{padding:7px!important;border-radius:14px!important}
  .contact-dark-form{padding:22px 16px!important}.contact-dark-footer{flex-direction:column!important;align-items:stretch!important}.contact-dark-footer button{width:100%!important}.footer-dark-grid{grid-template-columns:1fr!important}.footer-dark-bottom{flex-direction:column!important;align-items:flex-start!important;padding-block:18px!important}
}

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


/* ============================================================
   V3 — PROTEÇÕES CONTRA CORTE EM NOTEBOOKS / MONITORES
   ============================================================ */
html,body{max-width:100%;overflow-x:clip!important}
.wrap>*{min-width:0}
.tela2-grid,.zadara-service-grid,.zadara-model-grid,.clients-v8-logos,.cases-v8-grid,.contact-dark-grid,.footer-dark-grid{min-width:0!important}
.tela2-card,.zadara-card,.zadara-model-card,.client-v8,.case-v8,.contact-dark-form{max-width:100%!important;min-width:0!important}
.hero-card,.visual-stack,.itwv3-manifesto,.itwv3-content{min-width:0!important;max-width:100%!important}

@media (min-width:1800px){
  .wrap{width:min(calc(100% - 240px),var(--edit-site-max-width,1360px))!important}
}

@media (max-width:900px){
  .tela2-grid{grid-template-columns:1fr!important}
  .zadara-service-grid{grid-template-columns:1fr!important}
  .zadara-service-grid .zadara-card:last-child{grid-column:auto!important}
}


/* V5 — carrossel, atalhos e âncoras */
/* ============================================================
   V5 — CARROSSEL + ATALHOS + NAVEGAÇÃO POR SEÇÕES
   Objetivos:
   1. carrossel contínuo e proporcional em qualquer monitor;
   2. atalhos abaixo do carrossel sem apertar/cortar;
   3. clique do menu alinhado de forma consistente abaixo do header.
   ============================================================ */

:root{
  --v5-header-gap: 22px;
  --v5-marquee-h: clamp(44px, 3.15vw, 58px);
  --v5-quick-icon: clamp(44px, 3.3vw, 58px);
}

/* O carrossel nunca cria lacunas visuais. Cada grupo tem conteúdo idêntico
   e o track desloca exatamente a largura de um dos quatro grupos. */
.tech-marquee{
  width:100% !important;
  height:var(--v5-marquee-h) !important;
  min-height:var(--v5-marquee-h) !important;
  overflow:hidden !important;
  display:block !important;
  background:linear-gradient(90deg,#050910 0%,#07101e 45%,#12082d 82%,#351486 100%) !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
  position:relative !important;
}
.tech-marquee::before,
.tech-marquee::after{
  width:clamp(24px,4vw,80px) !important;
  z-index:4 !important;
}
.tech-marquee-track{
  display:flex !important;
  align-items:center !important;
  width:max-content !important;
  min-width:max-content !important;
  height:100% !important;
  will-change:transform !important;
  animation:itwvMarqueeV5 28s linear infinite !important;
}
.tech-marquee-group{
  display:flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  width:max-content !important;
  min-width:max-content !important;
  height:100% !important;
  gap:clamp(14px,1.6vw,34px) !important;
  padding:0 clamp(14px,1.8vw,34px) 0 0 !important;
  white-space:nowrap !important;
}
.tech-marquee-group span{
  flex:0 0 auto !important;
  padding:0 !important;
  font-size:clamp(.70rem,.60vw + .18rem,.90rem) !important;
  font-weight:900 !important;
  letter-spacing:.105em !important;
  line-height:1 !important;
  color:rgba(236,243,255,.84) !important;
  white-space:nowrap !important;
}
.tech-marquee-group i{
  display:block !important;
  flex:0 0 auto !important;
  width:5px !important;
  height:5px !important;
  border-radius:50% !important;
  background:#7548ef !important;
  box-shadow:0 0 0 5px rgba(117,72,239,.12),0 0 14px rgba(117,72,239,.30) !important;
}
@keyframes itwvMarqueeV5{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-25%,0,0)}
}
.tech-marquee:hover .tech-marquee-track{animation-play-state:paused !important;}

/* Atalhos abaixo do carrossel */
.quick-links{
  padding:clamp(24px,2.7vw,44px) 0 !important;
  background:#050a12 !important;
  border-top:0 !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
}
.quick-links .wrap{
  max-width:var(--edit-site-max-width,1360px) !important;
}
.quick-grid{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:clamp(14px,2vw,34px) !important;
  align-items:start !important;
  text-align:center !important;
}
.quick-item{
  min-width:0 !important;
  min-height:clamp(96px,8.5vw,132px) !important;
  padding:clamp(10px,1.25vw,18px) 8px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:clamp(10px,1vw,14px) !important;
  border-radius:14px !important;
  transition:background .2s ease,transform .2s ease !important;
}
.quick-item:hover{
  background:rgba(255,255,255,.035) !important;
  transform:translateY(-2px) !important;
}
.quick-icon{
  width:var(--v5-quick-icon) !important;
  height:var(--v5-quick-icon) !important;
  margin:0 !important;
  display:grid !important;
  place-items:center !important;
  flex:0 0 auto !important;
  font-size:clamp(.82rem,.66vw + .25rem,1.05rem) !important;
  border-radius:0 !important;
}
.quick-item strong{
  display:block !important;
  max-width:100% !important;
  font-size:clamp(.78rem,.48vw + .30rem,1rem) !important;
  line-height:1.25 !important;
  color:#7fc4ff !important;
  text-wrap:balance !important;
  overflow-wrap:anywhere !important;
}

/* Âncoras: fallback CSS. O JS abaixo calcula a altura real do header. */
#inicio,#solucoes,#itwv,#zadara,#clientes,#contato{
  scroll-margin-top:96px !important;
}
html{scroll-padding-top:96px !important;overflow-anchor:none !important;}

/* Monitor médio / notebook: preserva os 5 atalhos sem comprimir demais */
@media (max-width:1180px){
  .quick-grid{gap:12px !important;}
  .quick-item{min-height:104px !important;padding-inline:5px !important;}
  .quick-item strong{font-size:clamp(.72rem,.9vw,.88rem) !important;}
}

/* Tablet / notebook estreito */
@media (max-width:900px){
  :root{--v5-marquee-h:46px;--v5-quick-icon:48px;}
  .quick-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    max-width:760px !important;
    margin-inline:auto !important;
  }
  .quick-item{min-height:96px !important;}
}

/* Celular */
@media (max-width:600px){
  :root{--v5-marquee-h:44px;--v5-header-gap:14px;--v5-quick-icon:46px;}
  .tech-marquee-group{gap:18px !important;padding-right:18px !important;}
  .tech-marquee-group span{font-size:.74rem !important;letter-spacing:.08em !important;}
  .quick-links{padding:22px 0 26px !important;}
  .quick-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .quick-item{
    min-height:94px !important;
    padding:10px 6px !important;
    border:1px solid rgba(255,255,255,.055) !important;
    background:rgba(255,255,255,.018) !important;
  }
  .quick-item:last-child{grid-column:1/-1 !important;width:min(50%,220px) !important;justify-self:center !important;}
  .quick-item strong{font-size:.82rem !important;}
  #inicio,#solucoes,#itwv,#zadara,#clientes,#contato{scroll-margin-top:82px !important;}
  html{scroll-padding-top:82px !important;}
}

@media (min-width:1800px){
  .tech-marquee-track{animation-duration:32s !important;}
  .quick-item{min-height:138px !important;}
}

@media (prefers-reduced-motion:reduce){
  .tech-marquee-track{animation-duration:70s !important;}
}
