img:is([sizes=auto i], [sizes^="auto," i]) {
      contain-intrinsic-size: 3000px 1500px
    }


    img.wp-smiley,
    img.emoji {
      display: inline !important;
      border: none !important;
      box-shadow: none !important;
      height: 1em !important;
      width: 1em !important;
      margin: 0 0.07em !important;
      vertical-align: -0.1em !important;
      background: none !important;
      padding: 0 !important;
    }

    :root {
      --wp-block-synced-color: #7a00df;
      --wp-block-synced-color--rgb: 122, 0, 223;
      --wp-bound-block-color: var(--wp-block-synced-color);
      --wp-editor-canvas-background: #ddd;
      --wp-admin-theme-color: #007cba;
      --wp-admin-theme-color--rgb: 0, 124, 186;
      --wp-admin-theme-color-darker-10: #006ba1;
      --wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
      --wp-admin-theme-color-darker-20: #005a87;
      --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
      --wp-admin-border-width-focus: 2px
    }

    @media (min-resolution:192dpi) {
      :root {
        --wp-admin-border-width-focus: 1.5px
      }
    }

    .wp-element-button {
      cursor: pointer
    }

    :root .has-very-light-gray-background-color {
      background-color: #eee
    }

    :root .has-very-dark-gray-background-color {
      background-color: #313131
    }

    :root .has-very-light-gray-color {
      color: #eee
    }

    :root .has-very-dark-gray-color {
      color: #313131
    }

    :root .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {
      background: linear-gradient(135deg, #00d084, #0693e3)
    }

    :root .has-purple-crush-gradient-background {
      background: linear-gradient(135deg, #34e2e4, #4721fb 50%, #ab1dfe)
    }

    :root .has-hazy-dawn-gradient-background {
      background: linear-gradient(135deg, #faaca8, #dad0ec)
    }

    :root .has-subdued-olive-gradient-background {
      background: linear-gradient(135deg, #fafae1, #67a671)
    }

    :root .has-atomic-cream-gradient-background {
      background: linear-gradient(135deg, #fdd79a, #004a59)
    }

    :root .has-nightshade-gradient-background {
      background: linear-gradient(135deg, #330968, #31cdcf)
    }

    :root .has-midnight-gradient-background {
      background: linear-gradient(135deg, #020381, #2874fc)
    }

    :root {
      --wp--preset--font-size--normal: 16px;
      --wp--preset--font-size--huge: 42px
    }

    .has-regular-font-size {
      font-size: 1em
    }

    .has-larger-font-size {
      font-size: 2.625em
    }

    .has-normal-font-size {
      font-size: var(--wp--preset--font-size--normal)
    }

    .has-huge-font-size {
      font-size: var(--wp--preset--font-size--huge)
    }

    :root .has-text-align-center {
      text-align: center;
    }

    :root .has-text-align-left {
      text-align: left
    }

    :root .has-text-align-right {
      text-align: right
    }

    .has-fit-text {
      white-space: nowrap !important;
    }

    #end-resizable-editor-section {
      display: none;
    }

    .aligncenter {
      clear: both;
    }

    .items-justified-left {
      justify-content: flex-start;
    }

    .items-justified-center {
      justify-content: center;
    }

    .items-justified-right {
      justify-content: flex-end;
    }

    .items-justified-space-between {
      justify-content: space-between;
    }

    .screen-reader-text {
      word-wrap: normal !important;
      border: 0;
      clip-path: inset(50%);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px
    }

    .screen-reader-text:focus {
      background-color: #ddd;
      clip-path: none;
      color: #444;
      display: block;
      font-size: 1em;
      height: auto;
      left: 5px;
      line-height: normal;
      padding: 15px 23px 14px;
      text-decoration: none;
      top: 5px;
      width: auto;
      z-index: 100000
    }

    html :where(.has-border-color) {
      border-style: solid;
    }

    html :where([style*=border-color]) {
      border-style: solid;
    }

    html :where([style*=border-top-color]) {
      border-top-style: solid;
    }

    html :where([style*=border-right-color]) {
      border-right-style: solid;
    }

    html :where([style*=border-bottom-color]) {
      border-bottom-style: solid;
    }

    html :where([style*=border-left-color]) {
      border-left-style: solid;
    }

    html :where([style*=border-width]) {
      border-style: solid;
    }

    html :where([style*=border-top-width]) {
      border-top-style: solid;
    }

    html :where([style*=border-right-width]) {
      border-right-style: solid;
    }

    html :where([style*=border-bottom-width]) {
      border-bottom-style: solid;
    }

    html :where([style*=border-left-width]) {
      border-left-style: solid;
    }

    html :where(img[class*=wp-image-]) {
      height: auto;
      max-width: 100%
    }

    :where(figure) {
      margin: 0 0 1em
    }

    html :where(.is-position-sticky) {
      --wp-admin--admin-bar--position-offset: var(--wp-admin--admin-bar--height, 0px)
    }

    @media screen and (max-width:600px) {
      html :where(.is-position-sticky) {
        --wp-admin--admin-bar--position-offset: 0px
      }
    }

@media all and (max-width: 1100px) {
	header .menu {
		display: none;
	}
	header .logo, header .icone {
		width: 50%;
	}
	.menu-open .logo, .menu-open .icone {
		position: absolute;
		width: 50%;
		z-index:1000;
	}
	header .icone {
		margin-top:10px;
	}
	.mask-image h1 {		
		bottom: 25vh;
		left: auto;		
		max-width: 80%;
		font-size: 1.8em;		
		margin: 0px 10%;
	}
	.menu-open .box-1 {
		display:none;
	}
	.menu-open .box-2 {
		width: 100%;
		right: 0px;
	}
	#menu-secundario a {
		padding:10px 0px;
		font-size:1.5em;
	}
	.card .redes-sociais {
		width: 100%;
		margin-top: 20px;
	}
	.card .botoes {
		width: 100%;
		margin: 10px 0px 0px 0px;
	}
	.card .botoes a {
		font-size: 0.8em;
	}
	.legenda {
		left: 50%;		
		width: 40%;
		text-align:center;
	}
	.frase h2 {
		font-size: 2em;
	}
	.frase svg {
		margin: 0px 0px 60px 0px;
	}
	.bloco-horizontal {
		display:none;
	}
	.bloco-horizontal-mobile {
		display:block;
	}
	.floating-item {
		position: relative;
	}
	.item-1, .item-2, .item-3, .item-4, .item-5, .item-6, .item-7, .item-8 {
		width:80%;
		margin:0px 10%;
		left:auto;
		top:auto;
		bottom:auto;
	}
	.floating-item .img {
		margin-bottom:40px;
		height:35vh;
	}
	.linha {
		display:none;
	}
	.implantacao h2 {		
		font-size: 2em;
		line-height: 130%;
		padding:0px 0px 40px 0px;
		width:100%;
	}
	.implantacao .frase-top {
		width: 100%;
		padding: 0px 0px 60px 0px;
	}
	.implantacao .frase-bottom {
		width: 100%;
		padding: 60px 0px 60px 0px;
	}
	.implantacao .box {
		width: 100%;
		margin: 10px 0px;
	}
	.transformacao .mask-animada {
		width: 200%;
		height: 200%;
	}
	.transformacao .imagem {
		float: left;
		width: 100%;
		margin-top: 0px;
	}
	.transformacao .texto {
		float: left;
		width: 100%;
		margin-top: 40px;
		padding: 0px 10%;
	}
	.transformacao h2 {
		padding-bottom: 60px;
		font-size: 2em;
		width: 100%;
	}
	.lojas {		
		padding: 50px 0px;
	}
	.lojas .imagem1, .lojas .imagem2 {
		width: 100%;
		margin: 0px;
	}
	.lojas h2 {
		font-size: 3em;
	}
	.lojas .texto {
		width: 80%;
		margin: 20px 10%;
	}
	 .lojas .texto:nth-of-type(3) {
		width: 80%;
		margin: 100px 10% 20px 10%;
	}
	.lojas .texto1 {
		width: 90%;
		margin: 50px 5%;
	}
	.texto1 .titulo {
		line-height: 100%;
		font-size: 2.5em;
	}
	.lojas .texto1 .rolagem {
		width: 100%;
	}
	.lojas .texto1 .rolagem::after {  
		font-size:2.5em!important;	
		line-height:60px;
	}
	.execucao .box {
		width: 95%;
		margin: 0 2.5%;
	}
	.execucao .box1 {
		width: 80%;
		margin: 0px 10%;
	}
	.execucao h2 {
		font-size: 2em;		
	}
	.execucao p {
		padding: 10px 0px;
	}
	.execucao .imagem h2 {		
		font-size: 2.5em;		
	}
	.processos .box {
		width: 80%;
		margin: 0px 10%;
		padding: 60px 0px;
	}
	.processos .box h2 {
		font-size: 2em;
		width: 100%;
		line-height: 120%;
	}
	.processos .topicos {
		display: inline-block;
		width: 100%;
		margin: 20px 0px ;
		position: relative;
		vertical-align: top;
	}
	.processos .miniatura {
		margin-top: 0px;
		min-height: 40vh;
	}
	.trabalhamos {
		display: block;
	}
	.trabalhamos .box-1 {
		padding: 100px 0px;
		width: 100%;
	}
	.processos h2, .trabalhamos h2 {		
		font-size: 2em;
		margin: 0px 10%;
		width: 80%;
	}
	.trabalhamos .traco {
		margin: 20px 10%;
	}
	.trabalhamos h5 {
		top: auto;
		transform: none;
		position: relative;
		right: auto;
		margin: 20px 10%;
	}
	.trabalhamos p span {
		display:block;
	}
	.trabalhamos p {
		padding:10px 20px;
	}
	.trabalhamos .box-2 {
		width: 100%;
	}
	.mapa {
		padding: 40px 0px;
	}
	.mapa .box-1 {
		width: 100%;
		margin: 0px;
	}
	.mapa .sub {
		font-size: 1em;
		padding: 0px 10%;
		line-height: 100%;
		text-align:center;
	}
	.mapa h2 {
		line-height: 120%;
		font-size: 2em;
		margin: 50px 10%;
		text-align: center;
	}
	.mapa p {		
		width: 80%;
		margin: 0px 10%;
	}
	.mapa .botao1, .chamada .botao1 {
		display: block;		
		text-align: center;
		width: 80%;
		margin: 40px 10%;
	}
	.mapa .box-2 svg {
		margin-top: 0px;
		width: 100vw;
		height: auto;
	}
	.historia {	
		padding: 60px 10%;
	}
	.historia .miniatura-1, .historia .miniatura-2, .historia .miniatura-3 {
		display:none;		
	}
	.historia .box {
		margin-left: 0;
		width: 100%;
	}
		.frase-historia {
		float: left;
		width: 100%;
		padding: 60px 10% 0px 10%;
	}
	.frase-historia .box {
		margin-left: 0px;
		width: 100%;
	}
	.frase-historia .texto1 .rolagem {		
		width: 100%;
		margin-top: 0px;
		margin-left: 0px;
		line-height: 50px;
		height: 50px;
	}
	
	.frase-historia .texto1 .rolagem::after {
		font-size: 2.4em!important;
		line-height: 50px;
		height: 50px;
	}
	.frase-historia .miniatura-3 {
		height: 30vh;
		width: 30vh;
		margin: 0px 0px 40px 0px;
	}
	.frase-historia .texto {
		float: left;
		width: 100%;
		margin: 0px 0px 40px 0px;
	}

}

    /*! This file is auto-generated */
    .wp-block-button__link {
      color: #fff;
      background-color: #32373c;
      border-radius: 9999px;
      box-shadow: none;
      text-decoration: none;
      padding: calc(.667em + 2px) calc(1.333em + 2px);
      font-size: 1.125em
    }

    .wp-block-file__button {
      background: #32373c;
      color: #fff;
      text-decoration: none
    }


    /* Cor da selecao de texto = amarelo do site */
    ::selection {
      background: #FDC408 !important;
      color: #0F0F0F !important;
    }

    ::-moz-selection {
      background: #FDC408 !important;
      color: #0F0F0F !important;
    }

    /* Onde o fundo e amarelo, a selecao fica branca (para nao sumir) */
    .frase ::selection,
    .execucao-parallax-wrapper ::selection,
    .etapa-card ::selection,
    .integracao .rolagem ::selection,
    .faq ::selection {
      background: #FFFFFF !important;
      color: #0F0F0F !important;
    }

    .frase ::-moz-selection,
    .execucao-parallax-wrapper ::-moz-selection,
    .etapa-card ::-moz-selection,
    .integracao .rolagem ::-moz-selection,
    .faq ::-moz-selection {
      background: #FFFFFF !important;
      color: #0F0F0F !important;
    }

    /* Efeito "roll" de texto nos botoes/CTAs ao passar o mouse */
    .botao1-texto .roll {
      display: inline-block !important;
      overflow: hidden !important;
      height: 1.2em !important;
      line-height: 1.2 !important;
      vertical-align: middle !important;
    }

    .botao1-texto .roll-inner {
      display: flex !important;
      flex-direction: column !important;
      transition: transform 0.45s cubic-bezier(0.76, 0, 0.24, 1) !important;
    }

    .botao1-texto .roll-inner>span {
      display: block !important;
      height: 1.2em !important;
      line-height: 1.2 !important;
    }
	
	.texto-horizontal {
		width: 100%;
		position: relative;
	}
	.texto-horizontal svg {
		width:100%;
		height:auto;
	}
	
    .lojas .botao1:hover .roll-inner,
    .lojas .botao2:hover .roll-inner,
    .mapa .botao1:hover .roll-inner,
    .chamada .botao1:hover .roll-inner {
      transform: translateY(-50%) !important;
    }

    /* Seta: slide simples no hover */
    .lojas .botao1 svg,
    .lojas .botao2 svg,
    .mapa .botao1 svg,
    .chamada .botao1 img {
      transition: transform 0.35s ease !important;
    }

    .lojas .botao1:hover svg,
    .lojas .botao2:hover svg,
    .mapa .botao1:hover svg {
      transform: translateX(5px) !important;
    }

    .chamada .botao1:hover img {
      transform: scaleX(-1) translateX(-5px) !important;
    }

    /* Espacamento entre o logo e o collage de imagens no menu aberto */
    .menu-open .box-1 {
      padding-top: 45px !important;
      box-sizing: border-box !important;
    }

    /* Aumenta um pouco a fonte do menu */
    .nav .menu a {
      font-size: 18px !important;
    }

    /* Menu: roll vertical suave no hover (COLA360 -> LOJAS COMPLETAS) */
    .menu-swap {
      position: relative !important;
      overflow: hidden !important;
      height: 1.4em !important;
      line-height: 1.4 !important;
    }

    .menu-swap .m-default,
    .menu-swap .m-hover {
      position: absolute !important;
      inset: 0 !important;
      display: flex !important;
      align-items: flex-end !important;
      justify-content: center !important;
      white-space: nowrap !important;
      line-height: 1 !important;
      transition: transform 0.5s cubic-bezier(0.76, 0, 0.24, 1) !important;
    }

    .menu-swap .m-hover {
      transform: translateY(110%) !important;
    }

    .menu-swap:hover .m-default {
      transform: translateY(-110%) !important;
    }

    .menu-swap:hover .m-hover {
      transform: translateY(0) !important;
    }

    /* Bolinhas de navegacao do slideshow do hero */
    .hero-dots {
      position: absolute !important;
      bottom: 30px !important;
      left: 50% !important;
      transform: translateX(-50%) !important;
      display: flex !important;
      gap: 12px !important;
      z-index: 10 !important;
    }

    .hero-dot {
      width: 12px !important;
      height: 12px !important;
      border-radius: 50% !important;
      background: rgba(255, 255, 255, 0.4) !important;
      cursor: pointer !important;
      transition: background 0.3s ease, transform 0.3s ease !important;
    }

    .hero-dot.active {
      background: #FDC408 !important;
      transform: scale(1.15) !important;
    }

    /* Rolagem suave para os links ancora do menu */
    html {
      scroll-behavior: smooth !important;
    }

    /* Eyebrow "COLA360" acima do titulo DO AMPLO */
    .lojas .texto .lojas-eyebrow {
      font-family: Montserrat, sans-serif !important;
      font-size: 14px !important;
      font-weight: 700 !important;
      color: #9a9a9a !important;
      letter-spacing: 1px !important;
      text-transform: uppercase !important;
      margin: 0 0 6px 0 !important;
    }

    .lojas .texto .lojas-eyebrow strong {
      color: #9a9a9a !important;
      font-weight: 900 !important;
    }

    /* Titulo "AO COMPACTO" igual ao "DO AMPLO" (tamanho/peso) */
    .lojas .texto h3 {
      font-family: Montserrat, sans-serif !important;
      font-size: 58px !important;
      font-weight: 900 !important;
      line-height: 0.95 !important;
      text-transform: uppercase !important;
      color: #0F0F0F !important;
      margin: 0 0 12px 0 !important;
    }

    /* Subtitulo "do grande ao compacto" em maiuscula */
    .lojas .texto1 .sub {
      text-transform: uppercase !important;
    }

    /* Esconde o botao SVG antigo do mapa (substituido por botao HTML padrao) */
    .mapa .mapa-botao-svg {
      display: none !important;
    }

    /* Padronizacao de TODOS os botoes da pagina (mesmo aspecto) */
    .lojas .botao1,
    .lojas .botao2,
    .mapa .botao1,
    .chamada .botao1 {
      display: flex !important;
      justify-content: center !important;
      align-items: center !important;
      padding: 8px 14px 8px 18px !important;
      background-color: #FDC408 !important;
      border-radius: 8px !important;
      text-decoration: none !important;
      text-transform: uppercase !important;
      color: #0F0F0F !important;
      font-family: Montserrat, sans-serif !important;
      font-weight: 600 !important;
      font-size: 13px !important;
      letter-spacing: 0.5px !important;
      width: 350px !important;
      max-width: 100% !important;
      height: 44px !important;
      margin: 0 auto !important;
      text-align: center !important;
      white-space: nowrap !important;
    }

    /* Forca os botoes de Lojas e Mapa a alinharem a esquerda junto com o texto */
    .lojas .botao1,
    .lojas .botao2,
    .mapa .botao1 {
      margin-left: 0 !important;
      margin-right: auto !important;
    }

    .chamada .botao1 {
      margin-top: 40px !important;
    }

    .botao1-texto {
      display: inline-block !important;
      vertical-align: middle !important;
      color: #0F0F0F !important;
      font-weight: 600 !important;
      font-size: 13px !important;
      text-transform: uppercase !important;
      letter-spacing: 0.5px !important;
      white-space: nowrap !important;
    }

    .lojas .botao1 svg,
    .lojas .botao2 svg,
    .mapa .botao1 svg {
      display: inline-block !important;
      vertical-align: middle !important;
      width: 26px !important;
      height: 24px !important;
      margin-left: 10px !important;
    }

    /* Garante que a seta seja so contorno (sem preenchimento cinza herdado do mapa) */
    .mapa .botao1 svg path {
      fill: none !important;
      stroke: #0F0F0F !important;
    }

    .mapa .botao1 img,
    .chamada .botao1 img {
      width: 18px !important;
      margin-left: 4px !important;
    }

    /* Card "PENSAR JUNTO": overlay amarelo em multiply (efeito duotone do print) */
    .special-item .large-image-overlay {
      background: rgba(253, 196, 8, 0.6) !important;
      mix-blend-mode: multiply !important;
    }

    /* Texto do card: menor e alinhado a esquerda */
    .special-item {
      justify-content: center !important;
      align-items: center !important;
      padding: 4vw !important;
      box-sizing: border-box !important;
    }

    .special-item h2 {
      font-size: 1.2vw !important;
      text-align: left !important;
      line-height: 1.1 !important;
    }

    /* Imagens "DO AMPLO"/"AO COMPACTO": sem sombra de caixa (fundo branco se funde) */
    .lojas .imagem1 img,
    .lojas .imagem2 img {
      filter: none !important;
    }

    /* AO COMPACTO: imagem maior (corrige a altura/sobreposicao da secao) */
    .lojas .imagem2 {
      width: 50% !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }

    .lojas .imagem2 img {
      width: 100% !important;
      height: auto !important;
    }

    /* Imagem da transformacao: aumenta para ficar no tamanho da anterior */
    .transformacao .imagem img {
      width: 160% !important;
      max-width: none !important;
    }

    .implantacao .box {
      border-radius: 16px !important;
      overflow: hidden !important;
      box-shadow: 0 0 0 2px #fff !important;
      outline: 2px solid #fff !important;
      -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
      mask-image: radial-gradient(white, black) !important;
      isolation: isolate !important;
    }

    .implantacao .miniatura {
      overflow: hidden !important;
      position: relative;
      /* ensure absolute children position correctly */
      border-radius: 16px !important;
      outline: 2px solid #fff !important;
      -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
      mask-image: radial-gradient(white, black) !important;
      background-size: cover !important;
    }

    /* Camada da imagem (zoom apenas aqui, label fica fixa) */
    .implantacao .miniatura::before {
      content: "" !important;
      position: absolute !important;
      inset: 0 !important;
      background: inherit !important;
      background-size: cover !important;
      background-position: center center !important;
      z-index: 0 !important;
      transition: transform 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    }

    .implantacao .miniatura:hover {
      animation: none !important;
    }

    .implantacao .miniatura:hover::before {
      transform: scale(1.07) !important;
    }

    /* Mantem a label/borda acima da imagem e sem zoom */
    .implantacao .borda {
      z-index: 1 !important;
    }

    /* Enquadra a imagem do card COLASIGNS como no print (letreiro centralizado, topo) */
    .implantacao .miniatura[style*="impl_3_signs"],
    .implantacao .miniatura[style*="impl_3_signs"]::before {
      background-position: 78% 35% !important;
    }


    /* === Implantacao: linha de baixo (texto + painel rotativo) === */
    .implantacao .impl-bottom {
		width: 100% !important;
		float: left !important;
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 40px 0px !important;
		padding: 60px 0px 20px 0px !important;
		box-sizing: border-box !important;
	}

    .implantacao .impl-bottom .frase-bottom {
		width: 50%!important;
		padding: 0 !important;
		margin: 0 !important;
		color: #595959 !important;
		font-family: Montserrat, sans-serif !important;
		font-style: normal !important;
		font-size: 1em !important;
		font-weight: 500 !important;
		line-height: 130% !important;
	}

   .implantacao .impl-rolagem {
    width: 50% !important;
    height: 56px !important;
    line-height: 56px !important;
    overflow: hidden !important;
    position: relative !important;
    left: auto !important;
    text-align: right;
}

.implantacao .impl-palavras {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    animation: implTrocaPalavras 12s infinite ease-in-out !important;
}

.implantacao .impl-palavras div {
    height: 56px !important;
    line-height: 56px !important;
    font-family: Montserrat, sans-serif !important;
    font-size: 30px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    color: #0F0F0F !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.implantacao .impl-palavras div span {
    color: #FDC408 !important;
}

@keyframes implTrocaPalavras {

    /* 1ª frase */
    0%,20%{
        transform: translateY(0);
    }

    /* 2ª frase */
    25%,45%{
        transform: translateY(-56px);
    }

    /* 3ª frase */
    50%,70%{
        transform: translateY(-112px);
    }

    /* 4ª frase */
    75%,95%{
        transform: translateY(-168px);
    }

    /* Volta para a primeira */
    100%{
        transform: translateY(0);
    }

}

    /* Frase: strong em branco, texto normal em preto */
    .frase strong {
      background: transparent !important;
      color: #FFFFFF !important;
      display: inline !important;
      opacity: 1 !important;
    }

    .implantacao {
      padding-top: 150px !important;
    }

    .processos {
      background: #ffffff !important;
      background-color: #ffffff !important;
    }

    /* Novo Layout Processos - Cards Amarelos (Grid 4x2) */
    .cases-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1.5vw;
    }

    .case-card {
      position: relative !important;
      width: 100% !important;
      aspect-ratio: 4/5 !important;
      cursor: pointer !important;
      border-radius: 1vw !important;
      overflow: hidden !important;
      isolation: isolate !important;
      -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
      mask-image: radial-gradient(white, black) !important;
      will-change: transform !important;
      transform: translateZ(0);
    }

    .case-tag {
      position: absolute !important;
      bottom: -1px !important;
      right: -1px !important;
      left: auto !important;
      background-color: #000 !important;
      color: #FDC408 !important;
      padding: 1vw 1.5vw !important;
      font-size: 1vw !important;
      font-weight: 800 !important;
      text-transform: uppercase !important;
      z-index: 10 !important;
      border-top-left-radius: 1vw !important;
      border-top-right-radius: 0 !important;
      border-bottom-right-radius: 1vw !important;
      border-bottom-left-radius: 0 !important;
    }

    .etapas-grid {
      display: grid !important;
      grid-template-columns: repeat(4, 1fr) !important;
      gap: 20px !important;
      margin-top: 50px !important;
      width: 100% !important;
    }

    .etapa-card {
      background: #FDC408 !important;
      border-radius: 12px !important;
      padding: 24px !important;
      display: flex !important;
      flex-direction: column !important;
      justify-content: space-between !important;
      min-height: 220px !important;
      box-sizing: border-box !important;
      overflow: hidden !important;
      transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    }

    .etapa-card:hover {
      transform: scale(1.04) !important;
      z-index: 10 !important;
      box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important;
    }

    .card-topo {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      width: 100% !important;
      margin-bottom: 20px !important;
    }

    .card-linha-seta {
      flex-grow: 1 !important;
      height: 5px !important;
      background: #fff !important;
      margin-right: 15px !important;
      margin-left: -24px !important;
      position: relative !important;
    }

    .card-linha-seta::after {
      content: "" !important;
      position: absolute !important;
      right: 0 !important;
      top: 50% !important;
      transform: translateY(-50%) rotate(45deg) !important;
      width: 12px !important;
      height: 12px !important;
      border-top: 5px solid #fff !important;
      border-right: 5px solid #fff !important;
    }

    .card-numero {
      font-family: Montserrat, sans-serif !important;
      font-size: 70px !important;
      font-weight: 900 !important;
      color: #000 !important;
      line-height: 1 !important;
    }

    .card-texto {
      font-family: Montserrat, sans-serif !important;
      font-size: 20px !important;
      font-weight: 600 !important;
      color: #000 !important;
      line-height: 1.3 !important;
      text-align: left !important;
    }

    .processos-titulo {
      font-family: Montserrat, sans-serif !important;
      font-size: 2.8em !important;
      font-weight: 900 !important;
      text-transform: uppercase !important;
      color: #000 !important;
      line-height: 1.3 !important;
      text-align: center !important;
      margin-bottom: 50px !important;
      width: 100% !important;
      position: relative !important;
      left: -100px !important;
    }

    @media (max-width: 992px) {
      .etapas-grid {
        grid-template-columns: repeat(2, 1fr) !important;
      }
    }

    @media (max-width: 576px) {
      .etapas-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
      }

      .etapa-card {
        min-height: 170px !important;
        padding: 20px !important;
        width: 75% !important;
        justify-self: center !important;
      }

      .card-linha-seta {
        margin-left: -20px !important;
      }
    }

    .degrade-fundo {
      background: linear-gradient(to bottom, transparent 0%, #FFFFFF 100%);
      padding-bottom: 5vw;
    }

    .processos {
      clear: both;
      display: block;
      width: 100%;
      float: none;
      overflow: hidden;
    }

    .trabalhamos {
      clear: both;
      display: block;
      width: 100%;
      float: none;
    }

    .lojas {
      padding-bottom: 30px !important;
    }

      .lojas .texto1 .rolagem {
    position: relative;
    display: inline-block;
    line-height: 65px;
    height: 65px;
    overflow: hidden;
    vertical-align: bottom;
    width: auto;
    min-width: 600px;
    margin-top: 5px;
}

.lojas .texto1 .rolagem .palavras {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    animation: lojasTrocaPalavras 9s infinite cubic-bezier(.77,0,.175,1);
}

.lojas .texto1 .rolagem .palavras div {
    font-family: Montserrat, sans-serif;
    font-size: 3.5em;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 65px;
    height: 65px;
    color: #0F0F0F;
    flex-shrink: 0;
    white-space: nowrap;
}

@keyframes lojasTrocaPalavras {

    /* ENGENHARIA */
    0%,28%{
        transform: translateY(0);
    }

    /* ORGANIZAÇÃO */
    33%,61%{
        transform: translateY(-65px);
    }

    /* ENERGIA COLA */
    66%,94%{
        transform: translateY(-130px);
    }

    /* Reinicia */
    100%{
        transform: translateY(0);
    }

}





    /* =========================================
   LAYOUT TRABALHAMOS SECTION
   ========================================= */
    .trabalhamos {
      display: flex !important;
      align-items: center !important;
      background-color: #FFFFFF !important;
      width: 100% !important;
      float: none !important;
      clear: both !important;
      border-bottom: none !important;
      padding: 100px 0 !important;
    }

    .trabalhamos .box-1 {
      width: 55% !important;
      background-color: #0F0F0F !important;
      padding: 100px 80px 100px 0 !important;
      border-radius: 0 80px 80px 0 !important;
      float: none !important;
      overflow: visible !important;
    }

    .trabalhamos .box-2 {
      width: 45% !important;
      text-align: left !important;
      padding: 0 80px 0 120px !important;
      float: none !important;
    }

    .trabalhamos .box-1 h3 {
      margin-left: 120px !important;
      font-family: Montserrat, sans-serif !important;
      font-size: 56px !important;
      font-weight: 900 !important;
      color: #FFFFFF !important;
      text-transform: uppercase !important;
      margin-bottom: 50px !important;
      text-align: left !important;
      line-height: 0.95 !important;
      letter-spacing: -3px !important;
      white-space: nowrap !important;
    }

    .trabalhamos .traco {
      display: none !important;
    }

    .trabalhamos .box-1 p {
      position: relative !important;
      margin-left: 200px !important;
      font-family: Montserrat, sans-serif !important;
      font-size: 22px !important;
      font-weight: 500 !important;
      color: #FFFFFF !important;
      padding: 18px 0 !important;
      text-align: left !important;
    }

    .trabalhamos .box-1 p:nth-child(3),
    .trabalhamos .box-1 p:nth-child(5),
    .trabalhamos .box-1 p:nth-child(7) {
      margin-left: 350px !important;
    }

    .trabalhamos .box-1 p strong {
      font-weight: 800 !important;
    }

    /* Hide old SVG arrows */
    .trabalhamos .box-1 p span {
      display: none !important;
    }

    /* === ARROWS: full SVG (line + arrowhead) in ::before === */

    /* Short arrow — items 2, 4 (children 4, 6) — 250px wide, bleeds ~61px outside card */
    .trabalhamos .box-1 p::before {
      content: '' !important;
      position: absolute !important;
      left: -261px !important;
      top: 50% !important;
      transform: translateY(-50%) !important;
      width: 250px !important;
      height: 22px !important;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='22' viewBox='0 0 250 22' fill='none'%3E%3Cpath d='M3 11L235 11' stroke='%23FDC408' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M228 2.5L239 11L228 19.5' stroke='%23FDC408' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
      background-repeat: no-repeat !important;
      background-size: 100% 100% !important;
      background-color: transparent !important;
    }

    /* Long arrow — items 1, 3, 5 (children 3, 5, 7) — 420px wide, bleeds ~80px outside card */
    .trabalhamos .box-1 p:nth-child(3)::before,
    .trabalhamos .box-1 p:nth-child(5)::before,
    .trabalhamos .box-1 p:nth-child(7)::before {
      left: -430px !important;
      width: 420px !important;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='22' viewBox='0 0 420 22' fill='none'%3E%3Cpath d='M3 11L405 11' stroke='%23FDC408' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M398 2.5L409 11L398 19.5' stroke='%23FDC408' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
      background-repeat: no-repeat !important;
      background-size: 100% 100% !important;
    }

    /* Remove the separate arrowhead pseudo-element */
    .trabalhamos .box-1 p::after {
      display: none !important;
      content: none !important;
    }


    .trabalhamos .box-2 h5 {
      position: static !important;
      transform: none !important;
      font-family: Montserrat, sans-serif !important;
      font-size: 48px !important;
      color: #2C2C2C !important;
      font-weight: 400 !important;
      line-height: 1.3 !important;
      text-align: left !important;
    }

    .trabalhamos .box-2 h5 strong {
      color: #FDC408 !important;
      font-weight: 900 !important;
    }




    /* =========================================
   LAYOUT FAQ SECTION (EXACT FIGMA PROPS)
   ========================================= */
    .faq {
      display: flex !important;
      align-items: flex-start !important;
      background-color: #FFFFFF !important;
      width: 100% !important;
      float: none !important;
      clear: both !important;
      position: relative !important;
      padding: 0 !important;
      overflow: hidden !important;
    }

    .faq::before {
      content: '' !important;
      position: absolute !important;
      display: block !important;
      top: 0 !important;
      left: 0 !important;
      width: 100% !important;
      height: 100% !important;
      background-image: url("data:image/svg+xml,%3Csvg width='1919' height='725' viewBox='0 0 1919 725' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M803.5 -35H2452V1024L321.5 958L688 680.5L803.5 -35Z' fill='%23FDC408'/%3E%3Cpath d='M932.313 -306.566H944.347C962.841 -306.566 976.303 -324.441 970.727 -342.045C838.352 -759.776 446.868 -1064 -13.558 -1064C-473.984 -1064 -862.816 -761.679 -996.484 -346.327C-1002.81 -326.82 -988.597 -306.634 -967.928 -306.634H-960.449C-940.936 -306.634 -926.454 -288.351 -931.418 -269.591C-951.203 -193.535 -961.741 -113.673 -961.741 -31.5C-961.741 50.6732 -951.203 130.535 -931.418 206.727C-926.59 225.487 -941.072 243.77 -960.449 243.77H-967.928C-988.461 243.77 -1002.67 263.82 -996.484 283.327C-862.816 698.883 -472.488 1001 -13.558 1001C445.372 1001 836.856 697.863 969.98 281.424C975.963 262.801 962.365 243.634 942.852 243.634H932.313C913.412 243.634 899.339 225.894 904.03 207.611C923.951 131.147 934.693 50.9451 934.693 -31.7039C934.693 -114.353 924.019 -194.487 904.03 -270.815C899.203 -289.098 913.412 -306.838 932.313 -306.838V-306.702V-306.566ZM-573.588 -795.867C-540.477 -840.861 -474.324 -840.861 -441.213 -795.867C-420.68 -767.864 -420.68 -728.171 -441.213 -700.168C-474.188 -655.173 -540.477 -655.173 -573.452 -700.168C-593.985 -728.171 -593.985 -767.864 -573.452 -796.003L-573.588 -795.867ZM-804.617 -564.912C-771.642 -610.043 -705.216 -610.043 -672.105 -565.048C-651.572 -537.045 -651.572 -497.216 -672.241 -469.213C-705.216 -424.354 -771.302 -424.354 -804.481 -469.213C-825.014 -497.216 -825.15 -536.909 -804.617 -564.912ZM661.919 633.566C628.944 678.696 562.518 678.56 529.543 633.566C509.01 605.563 509.01 565.87 529.679 537.867C562.654 493.008 628.944 493.008 661.919 537.867C682.452 565.87 682.452 605.563 661.919 633.566ZM731.54 224.399C727.597 236.09 716.31 243.906 703.868 243.906H655.052C643.766 243.906 633.771 250.635 629.08 260.898C517.713 504.699 271.318 674.958 -13.49 674.958C-298.298 674.958 -544.081 505.106 -655.788 261.714C-660.615 251.042 -671.153 243.974 -683.052 243.974H-730.372C-743.154 243.974 -754.713 236.089 -758.792 224.059C-786.192 144.061 -801.15 58.2177 -801.15 -31.2281C-801.15 -120.674 -786.192 -206.313 -758.792 -286.516C-754.713 -298.546 -743.086 -306.43 -730.372 -306.43H-683.052C-671.153 -306.43 -660.751 -313.431 -655.788 -324.17C-544.081 -567.563 -298.026 -737.414 -13.49 -737.414C271.047 -737.414 517.713 -567.155 629.08 -323.354C633.771 -313.091 643.766 -306.362 655.052 -306.362H703.868C716.174 -306.362 727.461 -298.614 731.54 -286.855C759.076 -206.721 774.169 -120.538 774.169 -31.0243C774.169 58.4895 759.212 144.537 731.54 224.807V224.195V224.399Z' fill='%23FDC408'/%3E%3C/svg%3E") !important;
      background-size: 100% auto !important;
      background-position: 0 top !important;
      background-repeat: no-repeat !important;
      z-index: 1 !important;
      animation: none !important;
    }

    .faq::after {
      display: none !important;
    }

    .faq .titulo {
      width: 40% !important;
      background-color: transparent !important;
      padding: 6.25vw 4.167vw 6.25vw 5.208vw !important;
      border-radius: 0 !important;
      float: none !important;
      min-height: 37.76vw !important;
      display: flex !important;
      flex-direction: column !important;
      justify-content: center !important;
      position: relative !important;
      z-index: 2 !important;
    }

    .faq .titulo h3 {
      color: #0F0F0F !important;
      font-size: 5vw !important;
      font-family: 'Montserrat', sans-serif !important;
      font-weight: 900 !important;
      text-transform: uppercase !important;
      margin-bottom: 1.563vw !important;
      margin-left: 0 !important;
      word-wrap: break-word !important;
      line-height: 1 !important;
    }

    .faq .titulo p {
      color: #595959 !important;
      font-size: 0.938vw !important;
      font-family: 'Montserrat', sans-serif !important;
      font-weight: 400 !important;
      line-height: 1.563vw !important;
      max-width: 17.292vw !important;
      word-wrap: break-word !important;
    }

    .faq .topicos {
      width: 60% !important;
      padding: 4.167vw 5.208vw 4.167vw 4.167vw !important;
      float: none !important;
      position: relative !important;
      z-index: 2 !important;
    }

    .faq .accordion {
      width: 46.667vw !important;
      max-width: 100% !important;
      height: 3.542vw !important;
      background-color: #0F0F0F !important;
      border-radius: 0.729vw !important;
      padding: 0 1.563vw !important;
      margin-bottom: 1.042vw !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      transition: all 0.3s ease !important;
      border: none !important;
    }

    .faq .accordion::after {
      content: "" !important;
    }

    .faq .accordion h6 {
      color: #FFFFFF !important;
      font-size: 1.25vw !important;
      font-family: 'Montserrat', sans-serif !important;
      font-weight: 700 !important;
      line-height: 1.426vw !important;
      margin: 0 !important;
      padding: 0 !important;
      word-wrap: break-word !important;
    }

    .faq .accordion .seta {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
    }

    .faq .accordion .seta::before {
      content: "+" !important;
      color: #FDC408 !important;
      font-size: 1.875vw !important;
      font-weight: 400 !important;
      line-height: 1 !important;
    }

    .faq .accordion.active {
      background-color: #FFFFFF !important;
      border-radius: 0.729vw 0.729vw 0 0 !important;
      margin-bottom: 0 !important;
    }

    .faq .accordion.active h6 {
      color: #0F0F0F !important;
    }

    .faq .accordion.active .seta::before {
      content: "\2212" !important;
      color: #0F0F0F !important;
    }

    .faq .panel {
      display: none;
      width: 46.667vw !important;
      max-width: 100% !important;
      height: auto !important;
      min-height: 4.01vw !important;
      max-height: none !important;
      overflow: hidden !important;
      background-color: #FFFFFF !important;
      border-radius: 0 0 0.729vw 0.729vw !important;
      padding: 0 1.563vw 1.042vw 1.563vw !important;
      margin-bottom: 1.042vw !important;
      box-sizing: border-box !important;
    }

    .faq .panel p {
      color: #0F0F0F !important;
      font-size: 1.25vw !important;
      font-family: 'Montserrat', sans-serif !important;
      font-weight: 400 !important;
      line-height: 1.426vw !important;
      margin: 0 !important;
      word-wrap: break-word !important;
    }


    /* =========================================
   LAYOUT MANIFESTO & MARCAS
   ========================================= */
    .manifesto-marcas {
		background-color: #FFFFFF !important;
		padding: 120px 0 100px 0 !important;
		width: 100% !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		overflow: hidden !important;
	}
    .manifesto-texto {
      text-align: center !important;
      max-width: 900px !important;
      margin: 0 auto 160px auto !important;
      padding: 0 20px !important;
    }

    .manifesto-texto h4 {
      font-family: 'Montserrat', sans-serif !important;
      font-size: 32px !important;
      font-weight: 700 !important;
      color: #0F0F0F !important;
      margin-bottom: 1.042vw !important;
      line-height: 1.4 !important;
    }

    .manifesto-texto p {
      font-family: 'Montserrat', sans-serif !important;
      font-size: 20px !important;
      font-weight: 400 !important;
      color: #404040 !important;
      line-height: 1.6 !important;
    }

    .marquee-container {
      width: 100% !important;
      overflow: hidden !important;
      white-space: nowrap !important;
      display: flex !important;
      position: relative !important;
    }

    .marquee-content {
      display: flex !important;
      align-items: center !important;
      width: max-content !important;
      animation: scrollMarquee 30s linear infinite !important;
      will-change: transform;
    }

    .marquee-content svg {
      height: 45px !important;
      width: 1307.17px !important;
      flex-shrink: 0 !important;
      margin-right: 20px !important;
    }

    @keyframes scrollMarquee {
      0% {
        transform: translateX(0);
      }

      100% {
        transform: translateX(-50%);
      }
    }

   

    .nova-secao-grind {
      background-color: #FFFFFF;
      padding: 3vw;
    }

    /* Estilos para a seção "Conheça nossos cases" */
    .cases-section {
      position: relative;
      padding: 8vw 5vw 7vw;
      background-color: #000;
      clear: both;
      float: left;
      width: 100%;
      border-bottom: 6vw solid #fff !important;
      font-family: 'Montserrat', sans-serif;
      z-index: 200 !important;
    }

    .cases-header {
      text-align: center;
      color: #fff;
      margin-bottom: 5vw;
    }

    .cases-header h2 {
      font-size: 60px;
      font-family: 'Montserrat', sans-serif;
      font-weight: 900;
      text-transform: uppercase;
      margin-bottom: 1.5vw;
      color: white;
      text-align: center;
    }

    .cases-header p {
      font-size: 18px;
      font-family: 'Montserrat', sans-serif;
      font-weight: 400;
      line-height: 30px;
      color: white;
      text-align: center;
      max-width: 606px;
      margin: 0 auto;
    }

    .cases-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1.5vw;
    }

    .case-img {
      width: 100% !important;
      height: 100% !important;
      background-size: cover !important;
      background-position: center !important;
      transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;
    }

    .case-card {
      position: relative !important;
      width: 100% !important;
      aspect-ratio: 430/515.4 !important;
      cursor: pointer !important;
      border-radius: 16px !important;
      overflow: hidden !important;
      isolation: isolate !important;
      -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
      mask-image: radial-gradient(white, black) !important;
      will-change: transform !important;
      transform: translateZ(0);
      box-sizing: border-box !important;
    }

    .case-card::after {
      content: '' !important;
      position: absolute !important;
      top: -2px !important;
      left: -2px !important;
      right: -2px !important;
      bottom: -2px !important;
      border: 6px solid transparent !important;
      border-radius: 17px !important;
      pointer-events: none !important;
      z-index: 2 !important;
      transition: border-color 0.3s ease !important;
    }

    .case-card:hover::after {
      border-color: #FDC408 !important;
    }

    .case-card:hover .case-img {
      transform: scale(1.06) !important;
    }

  

    /* =========================================
   LAYOUT MAPA SECTION (EXACT FIGMA PROPS)
   ========================================= */
    .mapa {
      background-color: #FFFFFF !important;
      padding: 120px 0 !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      width: 100% !important;
      float: none !important;
      clear: both !important;
      overflow: hidden !important;
      border-top: none !important;
      margin-top: -1px !important;
    }

    .mapa .box-1 {
      width: 42% !important;
      margin-left: 80px !important;
      margin-right: 0 !important;
      float: none !important;
      text-align: left !important;
    }

    .mapa .box-2 {
      width: 58% !important;
      float: none !important;
      display: flex !important;
      justify-content: center !important;
      align-items: center !important;
    }

    .mapa .box-2 svg {
      width: 90% !important;
      height: auto !important;
      margin-top: 0 !important;
    }

    .mapa .sub {
      font-family: Montserrat, sans-serif !important;
      font-size: 14px !important;
      font-weight: 700 !important;
      color: #7C7979 !important;
      text-transform: uppercase !important;
      letter-spacing: 1px !important;
      margin-bottom: 20px !important;
    }

    .mapa h3 {
      font-family: Montserrat, sans-serif !important;
      font-size: 56px !important;
      font-weight: 900 !important;
      color: #0F0F0F !important;
      text-transform: uppercase !important;
      line-height: 1.05 !important;
      letter-spacing: -2px !important;
      margin-bottom: 30px !important;
      text-align: left !important;
    }

    .mapa .traco {
      display: none !important;
    }

    .mapa p {
      font-family: Montserrat, sans-serif !important;
      font-size: 18px !important;
      font-weight: 500 !important;
      color: #595959 !important;
      line-height: 1.5 !important;
      margin-bottom: 20px !important;
      max-width: 480px !important;
    }

    .mapa p strong {
      font-weight: 800 !important;
      color: #0F0F0F !important;
    }

    /* Custom Premium Yellow Button for Mapa (Vector SVG Button) */
    .mapa-botao-svg {
      display: inline-block !important;
      transition: transform 0.3s ease !important;
      margin-top: 20px !important;
    }

    .mapa-botao-svg:hover {
      transform: scale(1.03) !important;
    }

    .mapa-botao-svg svg {
      display: block !important;
      width: 265px !important;
      height: 66px !important;
    }

    /* Force correct fills on button vector elements to override theme-style.css */
    .mapa-botao-svg svg rect {
      fill: #FDC408 !important;
    }

    .mapa-botao-svg svg path:not([stroke]) {
      fill: #0F0F0F !important;
    }

    .mapa-botao-svg svg path[stroke] {
      fill: none !important;
      stroke: #0F0F0F !important;
    }

    .mapa .box-2 svg polygon,
    .mapa .box-2 svg path {
      fill: #7C7979 !important;
    }

    .mapa .box-2 svg circle {
      fill: #FDC408 !important;
    }

    /* =========================================
   LAYOUT FRASE HISTORIA SECTION (CENTERED)
   ========================================= */
    .frase-historia {
      background-color: #FFFFFF !important;
      padding: 120px 0 50px 0 !important;
      width: 100% !important;
      display: flex !important;
      justify-content: center !important;
      align-items: center !important;
      float: none !important;
      clear: both !important;
    }

    .frase-historia .box {
      width: 100% !important;
      max-width: 800px !important;
      margin: 0 auto !important;
      float: none !important;
      text-align: center !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      justify-content: center !important;
    }

    .frase-historia .miniatura-3 {
      display: none !important;
    }

    .frase-historia .texto1 {
      display: none !important;
    }

    .frase-historia-titulo {
      font-family: Montserrat, sans-serif !important;
      font-size: 56px !important;
      font-weight: 900 !important;
      color: #0F0F0F !important;
      text-transform: uppercase !important;
      letter-spacing: -2px !important;
      margin-bottom: 40px !important;
      text-align: center !important;
      line-height: 1.1 !important;
      display: block !important;
      width: 100% !important;
    }

    .frase-historia .texto {
      width: 100% !important;
      float: none !important;
      margin: 0 !important;
      text-align: center !important;
    }

    .frase-historia p {
      font-family: Montserrat, sans-serif !important;
      font-size: 17px !important;
      font-weight: 500 !important;
      color: #7C7979 !important;
      line-height: 1.65 !important;
      margin-bottom: 24px !important;
      text-align: center !important;
      display: block !important;
      width: 100% !important;
      max-width: 650px !important;
      margin-left: auto !important;
      margin-right: auto !important;
    }

    /* ============================================================
   RESPONSIVO MOBILE (primeiro passe)
   ============================================================ */
    @media (max-width: 1024px) {

      html,
      body {
        overflow-x: hidden !important;
      }

      .transformacao {
        margin-top: 0 !important;
      }

      /* Menu topo e Header */
      header {
        padding: 20px !important;
      }

      header .nav {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
      }

      header .logo,
      header .icone {
        width: auto !important;
        float: none !important;
      }

      .nav .menu {
        display: none !important;
      }

      .nav .logo svg,
      header .logo svg {
        height: 38px !important;
      }

      header .mask {
        height: 100% !important;
      }

      /* Hero / cena */
      .scene {
        height: 100vh !important;
      }
	  .titulo-hero {
			position: absolute;
			bottom: auto;
			left: 5%;
			z-index: 10;
			top: 50vh;
		}
		.titulo-hero h1 {
			max-width:70%;
			font-size:1.6em;
		}

      .scene .image {
        background-color: transparent !important;
        background-size: cover !important;
        background-position: center top !important;
        background-repeat: no-repeat !important;
        background-origin: content-box !important;
        background-clip: content-box !important;
        padding-top: 12vw !important;
      }

      .scene .image>div:not(.mask-image) {
        background-size: cover !important;
        background-position: center top !important;
        background-repeat: no-repeat !important;
        background-origin: content-box !important;
        background-clip: content-box !important;
        padding-top: 12vw !important;
      }

      /* Sombra na parte de cima para não ficar um espaço */
      .scene .image::after {
        content: "" !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.4) 15%, rgba(0, 0, 0, 0) 40%) !important;
        pointer-events: none !important;
        z-index: 1 !important;
      }


      /* Remover linhas separadoras cinzas do mobile */
      hr {
        display: none !important;
      }

      .lojas,
      .mapa,
      .implantacao,
      .transformacao,
      .faq,
      .trabalhamos,
      .frase,
      .chamada,
      .scene,
      .curva {
        border-bottom: none !important;
        border-top: none !important;
        box-shadow: none !important;
        outline: none !important;
      }

      .faq .accordion {
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
      }

      .scene .image .mask-image h1 {
        font-size: 7vw !important;
        max-width: calc(100% - 40px) !important;
        bottom: 25vh !important;
        left: 20px !important;
      }

      .hero-dots {
        bottom: 12vw !important;
      }

      /* Curva sobe e sobrepoe o final da imagem do hero (como no desktop) */
      .curva {
        margin-top: -8vw !important;
        position: relative !important;
        z-index: 2 !important;
        display: block !important;
      }

      /* Frase */
      .frase h2,
      .frase #fraseText {
        font-size: 8vw !important;
        line-height: 1.15 !important;
      }

      .frase {
        padding: 60px 20px 80px 20px !important;
      }

      /* A MESMA ENGENHARIA (palavras rotativas) */
      .lojas .texto1 .rolagem .palavras div {
        font-size: 2em !important;
      }

      .lojas .texto1 .rolagem {
		min-width: 0 !important;
		width: 100% !important;
		line-height: 45px !important;
		height: 45px !important;
		margin: 0px;
	}

      .lojas .texto1 {
        width: 100% !important;
        margin: 30px 20px !important;
      }

      /* DO AMPLO / AO COMPACTO -> empilhar imagem e texto */
      .lojas {
        flex-direction: column !important;
        padding: 60px 0 !important;
      }

      .lojas .imagem1,
      .lojas .imagem2,
      .lojas .texto {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 20px !important;
        box-sizing: border-box !important;
        left: 0 !important;
      }

      .lojas .texto {
        padding: 10px 20px 40px 20px !important;
      }

      .lojas .botao1, .lojas .botao2 {
		width: max-content !important;
		margin: 40px 0px !important;
	}

      .lojas .imagem1,
      .lojas .imagem2 {
        padding: 0 !important;
      }

 

      .lojas .texto>svg {
        width: 70vw !important;
        height: auto !important;
      }

      .lojas .texto h3 {
        font-size: 12vw !important;
      }

      .lojas .texto p {
        font-size: 16px !important;
      }

      /* Reordenar COLA POCKET no mobile (imagem acima do texto) */
      .lojas {
        display: flex !important;
        flex-direction: column !important;
        overflow-x: hidden !important;
      }

      .lojas>.imagem1 {
        order: 1 !important;
      }

      .lojas>div.texto:nth-child(2) {
        order: 2 !important;
      }

      .lojas>.imagem2 {
        order: 3 !important;
      }

      .lojas>div.texto:nth-child(3) {
        order: 4 !important;
      }

      .lojas>.texto1-container {
        order: 5 !important;
      }

      /* Fix Execucao Parallax Mobile */
      .execucao-bg-text {
        box-sizing: border-box !important;
        padding: 8vw 5vw 0 5vw !important;
        width: 100% !important;
      }

      .execucao-bg-text h3 {
        font-size: 6.5vw !important;
        margin-bottom: 5vw !important;
      }

      .execucao-bg-text p {
        font-size: 3.5vw !important;
        line-height: 1.5 !important;
        margin-bottom: 4vw !important;
      }

      .execucao-parallax-pin {
        border-radius: 0 !important;
        height: 100vh !important;
      }

      .processos {
        margin-top: -2px !important;
        position: relative;
        z-index: 10;
      }

      /* Fix Processos Mobile */
      .processos .box {
        width: 100% !important;
        margin: 0 !important;
        padding: 10vw 0 !important;
        box-sizing: border-box !important;
      }

      .processos-titulo {
		font-size: 6.5vw !important;
		line-height: 1.3 !important;
		padding: 0px 0px !important;
		box-sizing: border-box !important;
		text-align: center !important;
		margin: 40px 0px !important;
		width: 100% !important;
		left:auto!important;
	}

      /* Fix FAQ Mobile */
      .faq {
        display: flex !important;
        flex-direction: column !important;
      }

      .faq::before {
        height: 55vw !important;
        background-size: 140% 100% !important;
        background-position: left top !important;
      }

      .faq .titulo {
        width: 100% !important;
        padding: 15vw 5vw 2vw 5vw !important;
        min-height: auto !important;
      }

      .faq .titulo h3 {
        font-size: 11vw !important;
        margin-bottom: 0 !important;
        text-align: left !important;
      }

      .faq .titulo p {
        font-size: 4.2vw !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding-left: 55% !important;
        margin: -22vw 0 0 0 !important;
        max-width: 100% !important;
        line-height: 1.4 !important;
        color: #0F0F0F !important;
        font-weight: 500 !important;
        position: relative !important;
        z-index: 5 !important;
        text-align: right !important;
      }

      .faq .topicos {
        width: 100% !important;
        padding: 5vw 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
      }

      .faq .accordion {
        width: 90% !important;
        margin: 0 auto 3vw auto !important;
        height: auto !important;
        min-height: 15vw !important;
        padding: 4vw 5vw !important;
        border-radius: 2vw !important;
        box-sizing: border-box !important;
      }

      .faq .accordion h6 {
        font-size: 4vw !important;
        line-height: 1.4 !important;
        margin: 0 !important;
      }

      .faq .accordion .seta::before {
        font-size: 6vw !important;
      }

      .faq .panel {
        width: 100% !important;
        padding: 0 5vw 5vw 5vw !important;
        box-sizing: border-box !important;
        border-radius: 0 0 2vw 2vw !important;
      }

      .faq .panel p {
        font-size: 3.5vw !important;
        line-height: 1.5 !important;
      }

      /* Fix Chamada Mobile */
      .chamada {
        padding: 15vw 5vw !important;
        box-sizing: border-box !important;
      }

      .chamada h4 {
        font-size: 6.5vw !important;
        line-height: 1.3 !important;
        margin-bottom: 8vw !important;
      }



      /* Implantao */
      .implantacao {
        padding-top: 60px !important;
        overflow-x: hidden !important;
      }

      .implantacao .topo {
        padding: 0 !important;
      }

      .implantacao .topo h2,
      .implantacao h2,
      .implantacao h2 strong {
        font-size: 7.5vw !important;
        line-height: 1.1 !important;
      }

      .implantacao .topo h2,
      .implantacao h2 {
        width: 100% !important;
        float: none !important;
        padding: 0 20px !important;
        margin: 0 0 18px 0 !important;
        box-sizing: border-box !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        hyphens: none !important;
      }

      .implantacao .frase-top {
        width: 100% !important;
        left: 0 !important;
        padding: 0 20px !important;
        margin: 0 0 30px 0 !important;
        font-size: 17px !important;
        line-height: 1.5 !important;
        position: relative !important;
        box-sizing: border-box !important;
      }

      .implantacao .box {
        width: calc(50% - 16px) !important;
        margin: 8px !important;
      }

      .implantacao .miniatura {
        min-height: 32vh !important;
      }

      .implantacao .impl-bottom {
        flex-direction: column !important;
        gap: 16px !important;
        padding: 40px 20px !important;
      }

      .implantacao .impl-bottom .frase-bottom {
        width: 100% !important;
        font-size: 17px !important;
        line-height: 1.5 !important;
      }

      .implantacao .impl-rolagem {
        width: 100% !important;
        left: 0 !important;
        margin-top: 10px !important;
      }

      .implantacao .impl-palavras div {
        font-size: 3.5vw !important;
      }
     
      /* História */
      .historia {
        aspect-ratio: auto !important;
        min-height: auto !important;
        background-size: cover !important;
        padding: 40px 0 !important;
        display: block !important;
        position: relative !important;
      }

      .historia::before {
        content: "" !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        background: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 100%) !important;
        z-index: 1 !important;
      }

      .historia .box {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        display: block !important;
        position: relative !important;
        z-index: 2 !important;
      }

      .historia h3 {
        font-size: 2.2em !important;
        margin-bottom: 20px !important;
        line-height: 1.1 !important;
        display: block !important;
      }

      .historia p {
        font-size: 1.05em !important;
        line-height: 1.4 !important;
        display: block !important;
      }

      /* Frase Historia */
      .frase-historia .box {
        padding: 60px 20px !important;
        box-sizing: border-box !important;
        width: 100% !important;
      }

      .frase-historia-titulo {
        font-size: 11vw !important;
      }

      .frase-historia p {
        font-size: 16px !important;
        padding: 0 10px !important;
      }

      .frase-historia p br {
        display: none !important;
      }

      /* Transformao -> empilhar, esconder o anel amarelo (estoura), reduzir fonte */
      .transformacao {
        background: #FFFFFF !important;
        position: relative !important;
        z-index: 100 !important;
        padding-top: 6vw !important;
      }

      .transformacao::before {
        content: "" !important;
        position: absolute !important;
        top: -10px !important;
        left: 0 !important;
        width: 100% !important;
        height: 10px !important;
        background: #FFFFFF !important;
        z-index: -1 !important;
      }

      .transformacao .imagem,
      .transformacao .texto {
        width: 100% !important;
        float: none !important;
        margin-top: 0 !important;
        box-sizing: border-box !important;
      }

      .transformacao .texto {
        padding: 30px 20px 50px 20px !important;
      }

      .transformacao h2 {
        font-size: 8vw !important;
      }

      .transformacao h2 br,
      .transformacao p br {
        display: none !important;
      }

      .transformacao p {
        max-width: 100% !important;
        font-size: 16px !important;
      }

      .transformacao p:first-of-type {
        margin-top: 24px !important;
      }

      .transformacao .imagem img {
        width: 165% !important;
        max-width: none !important;
        margin-left: calc(-10% + 25px) !important;
        height: auto !important;
      }

      .transformacao .mask-animada {
        display: none !important;
      }

      /* Mapa */
      .mapa {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 60px 20px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
      }

      .mapa .box-1 {
        display: contents !important;
      }

      .mapa .box-2 {
        width: 100% !important;
        order: 5 !important;
        margin: 30px 0 40px 0 !important;
        display: flex !important;
        justify-content: center !important;
      }

      .mapa .box-2 svg {
        transform: scale(1.25) !important;
        transform-origin: center !important;
      }

      .mapa .box-1 .sub {
        order: 1 !important;
      }

      .mapa h3 {
        font-size: 10vw !important;
        order: 2 !important;
      }

      .mapa .box-1 p:nth-of-type(1) {
        order: 3 !important;
      }

      .mapa .box-1 p:nth-of-type(2) {
        order: 4 !important;
      }

      .mapa .botao1 {
        order: 6 !important;
      }

      .mapa .mapa-botao-svg {
        order: 7 !important;
      }

      /* Trabalhamos */
      .trabalhamos {
        flex-direction: column !important;
        padding: 50px 0 !important;
        box-sizing: border-box !important;
      }

      .trabalhamos .box-1 {
        width: 100% !important;
        padding: 50px 20px !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
        margin: 0 !important;
      }

      .trabalhamos .box-2 {
        width: 100% !important;
        padding: 130px 20px 50px 20px !important;
        box-sizing: border-box !important;
        text-align: center !important;
      }

      .trabalhamos .box-1 h3 {
        font-size: 8vw !important;
        margin-left: 0 !important;
        white-space: normal !important;
        letter-spacing: -1px !important;
        text-align: left !important;
      }

      .trabalhamos .box-1 p {
        text-align: left !important;
        margin: 0 !important;
        font-size: 18px !important;
        padding-left: 50px !important;
        position: relative !important;
      }

      .trabalhamos .box-1 p:nth-child(3),
      .trabalhamos .box-1 p:nth-child(5),
      .trabalhamos .box-1 p:nth-child(7) {
        margin-left: 0 !important;
      }

      .trabalhamos .box-1 p::before,
      .trabalhamos .box-1 p:nth-child(3)::before,
      .trabalhamos .box-1 p:nth-child(5)::before,
      .trabalhamos .box-1 p:nth-child(7)::before {
        display: block !important;
        content: '' !important;
        position: absolute !important;
        left: -20px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 55px !important;
        height: 16px !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='55' height='16' viewBox='0 0 55 16' fill='none'%3E%3Cpath d='M0 8L53 8' stroke='%23FDC408' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M46 2L53 8L46 14' stroke='%23FDC408' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
        background-repeat: no-repeat !important;
        background-size: contain !important;
      }

      .trabalhamos .box-2 h5 {
        font-size: 8vw !important;
        white-space: normal !important;
        text-align: center !important;
      }

      /* Logos marquee */
      .marquee-content svg {
        height: 32px !important;
      }

      .manifesto-marcas {
        padding: 120px 0 60px 0 !important;
      }

      .manifesto-texto span {
        font-size: 16px !important;
        line-height: 24px !important;
      }
    }

    @media (max-width: 600px) {
      .implantacao .box {
        width: calc(100% - 16px) !important;
      }
    }

    @media (min-width: 1025px) {
      .mapa .box-1 {
        max-width: max-content !important;
      }
      .mapa .botao1 {
        margin-left: 0 !important;
        margin-right: auto !important;
      }
    }

    @media (max-width: 1024px) {
      .secao-amarela-preta {
        padding: 50px 0 0 0 !important;
        background-color: #111111 !important;
        height: auto !important;
        display: block !important;
      }
      .secao-amarela-preta > div {
        height: auto !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        position: relative !important;
        gap: 0 !important;
      }
      /* Hide the desktop specific background shapes */
      .secao-amarela-preta > div > :nth-child(1),
      .secao-amarela-preta > div > :nth-child(2) {
        display: none !important;
      }
      /* Reset absolute positioning for all children */
      .secao-amarela-preta > div > * {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        transform: none !important;
        text-align: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
      }
      
      /* "com a cola" */
      .secao-amarela-preta > div > :nth-child(7) {
        order: 0;
        font-size: 24px !important;
        line-height: 1.2 !important;
        margin-bottom: 5px !important;
      }
      /* "você decola" */
      .secao-amarela-preta > div > :nth-child(6) {
        order: 1;
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin-bottom: 20px !important;
      }
      /* "Somos a sua única..." */
      .secao-amarela-preta > div > :nth-child(13) {
        order: 2;
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin-bottom: 40px !important;
      }
      /* "Links rápidos" */
      .secao-amarela-preta > div > :nth-child(8) {
        order: 3;
        font-size: 20px !important;
        margin-bottom: 15px !important;
      }
      /* "Cadastre-se Empresa..." */
      .secao-amarela-preta > div > :nth-child(9) {
        order: 4;
        font-size: 16px !important;
        line-height: 2 !important;
        margin-bottom: 40px !important;
      }
      /* Button */
      .secao-amarela-preta > div > :nth-child(12) {
        order: 5;
        width: 80% !important;
        padding: 15px 0 !important;
        margin: 0 auto 40px auto !important;
      }
      .secao-amarela-preta > div > :nth-child(12) div {
        font-size: 16px !important;
      }
      .secao-amarela-preta > div > :nth-child(12) svg {
        width: 16px !important;
        height: 16px !important;
      }
      /* Address */
      .secao-amarela-preta > div > :nth-child(11) {
        order: 6;
        font-size: 14px !important;
        margin-bottom: 40px !important;
      }
      .secao-amarela-preta > div > :nth-child(11) span {
        font-size: 14px !important;
        line-height: 1.5 !important;
      }
      /* Socials */
      .secao-amarela-preta > div > :nth-child(10) {
        order: 7;
        gap: 15px !important;
        margin-bottom: 40px !important;
      }
      .secao-amarela-preta > div > :nth-child(10) svg {
        width: 40px !important;
        height: 40px !important;
      }
      
      /* Footer bottom links */
      .secao-amarela-preta > div > :nth-child(3) { /* copyright */
        order: 8;
        font-size: 12px !important;
        background-color: #FDC408 !important;
        padding-top: 30px !important;
        padding-bottom: 20px !important;
        margin-bottom: 0 !important;
        color: #111 !important;
      }
      .secao-amarela-preta > div > :nth-child(3) span {
        color: #111 !important;
        font-size: 12px !important;
      }
      .secao-amarela-preta > div > :nth-child(4) { /* privacy */
        order: 9;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        width: 50% !important;
        text-align: left !important;
        background-color: #FDC408 !important;
        box-shadow: 0 0 0 2px #FDC408 !important;
        padding: 15px 0 20px 20px !important;
        margin: 0 !important;
        color: #111 !important;
        font-size: 12px !important;
      }
      .secao-amarela-preta > div > :nth-child(5) { /* terms */
        order: 10;
        position: relative !important;
        right: auto !important;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        width: 50% !important;
        text-align: right !important;
        background-color: #FDC408 !important;
        box-shadow: 0 0 0 2px #FDC408 !important;
        padding: 15px 20px 20px 0 !important;
        margin: 0 !important;
        color: #111 !important;
        font-size: 12px !important;
      }
    }

    .historia {
      position: relative;
    }
    .historia::before {
      content: "" !important;
      position: absolute !important;
      top: 0 !important;
      left: 0 !important;
      width: 100% !important;
      height: 100% !important;
      background: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 100%) !important;
      z-index: 1 !important;
      pointer-events: none;
    }
    .historia .box {
      position: relative !important;
      z-index: 2 !important;
    }
    .cases-section {
      position: relative;
      padding: 8vw 5vw 7vw;
      background-color: #000;
      clear: both;
      float: left;
      width: 100%;
      z-index: 200 !important;
    }

    .cases-header {
      text-align: center;
      color: #fff;
      margin-bottom: 5vw;
    }

    .cases-header .subtitle {
      font-size: 1vw;
      text-transform: uppercase;
      letter-spacing: 2px;
      margin-bottom: 1vw;
    }

    .cases-header h2 {
      font-size: max(3.5vw, 32px);
      font-weight: 800;
      margin-bottom: 1.5vw;
    }

    .cases-header p {
      font-size: max(1.2vw, 16px);
      color: #ccc;
      line-height: 1.5;
      padding: 0 10px;
    }

    .cases-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1.5vw;
    }

    .case-img {
      width: 100% !important;
      height: 100% !important;
      background-size: cover !important;
      background-position: center !important;
      transition: transform 0.5s ease;
    }

    .case-card:hover .case-img {
      transform: scale(1.05);
    }