/***
 NAVBAR
 ***/

@media (max-width: 768px) {

	.nav-sully {
		padding: 0 20px;
	}
  .site-header .nav-pill {
    padding: 12px 16px !important;
  }

}



/***
 * INTRO – section
 ***/

@media (max-width: 768px) {

  /* evita “deriva” lateral no título (geralmente vem de transform/GSAP) */
  .hero-title-gsap {
    transform: none !important;
  }

  /* reduz o tamanho pra não cortar e dá respiro lateral */
  .hero-bgtype {
    padding-inline: 12px;
    transform: translateX(-50%);
    left: 34%;
    bottom: 280px;
  }
  .hero-bgtype h1{
    font-size: clamp(68px, 16vw, 140px);
    letter-spacing: .01em;
  }

  /* traz o retrato levemente pra esquerda e reduz a largura útil */
  .hero-figure {
    width: min(780px, 130vw);
    bottom: -24px;
    left: 48% !important;
	transform: translateX(-50%);
  }

  /* garante que a imagem nunca “estoure” no mobile */
  .hero-img {
    width: 100%;
    height: auto;
    max-height: 78vh;
    max-height: 78svh;
    max-height: 78dvh;
  }

  /* garante que a tagline não “vaze” */
  .hero-front {
    padding-inline: 1rem;
  }
  .hero-tagline {
    width: min(520px, 98vw);
    font-size: 18px;
  }
}


/***
 CLIENTS – section
 ***/

@media (min-width: 1024px) {
  .logo-scroller-item span img {
    max-height: 150px;  /* Larger height for big screens */
  }
}

/* For smaller screens (tablets) */
@media (max-width: 768px) {
  .logo-scroller-item {
    min-width: 180px; /* Adjust minimum width for smaller screens */
  }
  .logo-scroller-item span img {
    max-height: 180px;  /* Smaller height for tablets */
  }
}


/***
 ABOUT – section
 ***/

.section.section-about {
	/*padding: 0px;*/
}


/***
 CASES – section
 ***/

@media (max-width: 768px) {

	.section.section-cases {
		padding: 0;
	}

	.case-card {
		min-height: 400px;
	}
}


/***
 EXPERTISE – section
 ***/

@media (max-width: 768px) {
	.section.section-expertise {
		padding: 140px 0;
	}
	.section.section-expertise .mx-auto {
		display: table;
	}
	
}


/***
 MANIFESTO – section
 ***/

@media (max-width: 768px) {

	.section.section-manifesto {
		padding-bottom: 100px;
	}

	.section.section-manifesto .manifesto-text {
		font-size: clamp(28px, 2vw, 28px);
	}
}


/***
 CTA – section
 ***/

@media (max-width: 768px) {

	.section.section-cta {
		padding-top: 80px;
		padding-bottom: 0px;
	}


}